mobx-react
Advanced tools
mobx-react - npm Package Compare versions
Comparing version 3.5.1 to 3.5.2-alpha.1
401
custom.js
@@ -1,400 +0,1 @@ | ||
| (function() { | ||
| function mrFactory(mobx, React, ReactDOM) { | ||
| if (!mobx) | ||
| throw new Error("mobx-react requires the MobX package") | ||
| if (!React) | ||
| throw new Error("mobx-react/custom requires React to be available"); | ||
| /** | ||
| * dev tool support | ||
| */ | ||
| var isDevtoolsEnabled = false; | ||
| // WeakMap<Node, Object>; | ||
| var componentByNodeRegistery = typeof WeakMap !== "undefined" ? new WeakMap() : undefined; | ||
| var renderReporter = new EventEmitter(); | ||
| function findDOMNode(component) { | ||
| if (ReactDOM) | ||
| return ReactDOM.findDOMNode(component); | ||
| return null; | ||
| } | ||
| function reportRendering(component) { | ||
| var node = findDOMNode(component); | ||
| if (node && componentByNodeRegistery) | ||
| componentByNodeRegistery.set(node, component); | ||
| renderReporter.emit({ | ||
| event: 'render', | ||
| renderTime: component.__$mobRenderEnd - component.__$mobRenderStart, | ||
| totalTime: Date.now() - component.__$mobRenderStart, | ||
| component: component, | ||
| node: node | ||
| }); | ||
| } | ||
| function trackComponents() { | ||
| if (typeof WeakMap === "undefined") | ||
| throw new Error("[mobx-react] tracking components is not supported in this browser."); | ||
| if (!isDevtoolsEnabled) | ||
| isDevtoolsEnabled = true; | ||
| } | ||
| function EventEmitter() { | ||
| this.listeners = []; | ||
| }; | ||
| EventEmitter.prototype.on = function (cb) { | ||
| this.listeners.push(cb); | ||
| var self = this; | ||
| return function() { | ||
| var idx = self.listeners.indexOf(cb); | ||
| if (idx !== -1) | ||
| self.listeners.splice(idx, 1); | ||
| }; | ||
| }; | ||
| EventEmitter.prototype.emit = function(data) { | ||
| this.listeners.forEach(function (fn) { | ||
| fn(data); | ||
| }); | ||
| }; | ||
| /** | ||
| * Utilities | ||
| */ | ||
| var specialReactKeys = { children: true, key: true, ref: true }; | ||
| function patch(target, funcName) { | ||
| var base = target[funcName]; | ||
| var mixinFunc = reactiveMixin[funcName]; | ||
| if (!base) { | ||
| target[funcName] = mixinFunc; | ||
| } else { | ||
| target[funcName] = function() { | ||
| base.apply(this, arguments); | ||
| mixinFunc.apply(this, arguments); | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * ReactiveMixin | ||
| */ | ||
| var reactiveMixin = { | ||
| componentWillMount: function() { | ||
| // Generate friendly name for debugging | ||
| var name = [ | ||
| this.displayName || this.name || (this.constructor && (this.constructor.displayName || this.constructor.name)) || "<component>", | ||
| "#", this._reactInternalInstance && this._reactInternalInstance._rootNodeID, | ||
| ".render()" | ||
| ].join(""); | ||
| var baseRender = this.render.bind(this); | ||
| var self = this; | ||
| var reaction = null; | ||
| var isRenderingPending = false; | ||
| function initialRender() { | ||
| reaction = new mobx.Reaction(name, function() { | ||
| if (!isRenderingPending) { | ||
| // N.B. Getting here *before mounting* means that a component constructor has side effects (see the relevant test in misc.js) | ||
| // This unidiomatic React usage but React will correctly warn about this so we continue as usual | ||
| // See #85 / Pull #44 | ||
| isRenderingPending = true; | ||
| if (typeof self.componentWillReact === "function") | ||
| self.componentWillReact(); // TODO: wrap in action? | ||
| if (self.__$mobxIsUnmounted !== true) { | ||
| // If we are unmounted at this point, componentWillReact() had a side effect causing the component to unmounted | ||
| // TODO: remove this check? Then react will properly warn about the fact that this should not happen? See #73 | ||
| // However, people also claim this migth happen during unit tests.. | ||
| React.Component.prototype.forceUpdate.call(self) | ||
| } | ||
| } | ||
| }); | ||
| reactiveRender.$mobx = reaction; | ||
| self.render = reactiveRender; | ||
| return reactiveRender(); | ||
| } | ||
| function reactiveRender() { | ||
| isRenderingPending = false; | ||
| var rendering; | ||
| reaction.track(function() { | ||
| if (isDevtoolsEnabled) | ||
| self.__$mobRenderStart = Date.now(); | ||
| rendering = mobx.extras.allowStateChanges(false, baseRender); | ||
| if (isDevtoolsEnabled) | ||
| self.__$mobRenderEnd = Date.now(); | ||
| }); | ||
| return rendering; | ||
| } | ||
| this.render = initialRender; | ||
| }, | ||
| componentWillUnmount: function() { | ||
| this.render.$mobx && this.render.$mobx.dispose(); | ||
| this.__$mobxIsUnmounted = true; | ||
| if (isDevtoolsEnabled) { | ||
| var node = findDOMNode(this); | ||
| if (node && componentByNodeRegistery) { | ||
| componentByNodeRegistery.delete(node); | ||
| } | ||
| renderReporter.emit({ | ||
| event: 'destroy', | ||
| component: this, | ||
| node: node | ||
| }); | ||
| } | ||
| }, | ||
| componentDidMount: function() { | ||
| if (isDevtoolsEnabled) | ||
| reportRendering(this); | ||
| }, | ||
| componentDidUpdate: function() { | ||
| if (isDevtoolsEnabled) | ||
| reportRendering(this); | ||
| }, | ||
| shouldComponentUpdate: function(nextProps, nextState) { | ||
| // TODO: if context changed, return true.., see #18 | ||
| // if props or state did change, but a render was scheduled already, no additional render needs to be scheduled | ||
| if (this.render.$mobx && this.render.$mobx.isScheduled() === true) | ||
| return false; | ||
| // update on any state changes (as is the default) | ||
| if (this.state !== nextState) | ||
| return true; | ||
| // update if props are shallowly not equal, inspired by PureRenderMixin | ||
| var keys = Object.keys(this.props); | ||
| var key; | ||
| if (keys.length !== Object.keys(nextProps).length) | ||
| return true; | ||
| for(var i = keys.length -1; i >= 0, key = keys[i]; i--) { | ||
| var newValue = nextProps[key]; | ||
| if (newValue !== this.props[key]) { | ||
| return true; | ||
| } else if (newValue && typeof newValue === "object" && !mobx.isObservable(newValue)) { | ||
| /** | ||
| * If the newValue is still the same object, but that object is not observable, | ||
| * fallback to the default React behavior: update, because the object *might* have changed. | ||
| * If you need the non default behavior, just use the React pure render mixin, as that one | ||
| * will work fine with mobx as well, instead of the default implementation of | ||
| * observer. | ||
| */ | ||
| return true; | ||
| } | ||
| } | ||
| return false; | ||
| } | ||
| } | ||
| /** | ||
| * Observer function / decorator | ||
| */ | ||
| function observer(arg1, arg2) { | ||
| if (typeof arg1 === "string") | ||
| throw new Error("Store names should be provided as array"); | ||
| if (Array.isArray(arg1)) { | ||
| // component needs stores | ||
| if (!arg2) { | ||
| // invoked as decorator | ||
| return function(componentClass) { | ||
| return observer(arg1, componentClass); | ||
| } | ||
| } else { | ||
| // TODO: deprecate this invocation style | ||
| return inject.apply(null, arg1)(observer(arg2)); | ||
| } | ||
| } | ||
| var componentClass = arg1; | ||
| // Stateless function component: | ||
| // If it is function but doesn't seem to be a react class constructor, | ||
| // wrap it to a react class automatically | ||
| if ( | ||
| typeof componentClass === "function" && | ||
| (!componentClass.prototype || !componentClass.prototype.render) && | ||
| !componentClass.isReactClass && | ||
| !React.Component.isPrototypeOf(componentClass) | ||
| ) { | ||
| return observer(React.createClass({ | ||
| displayName: componentClass.displayName || componentClass.name, | ||
| propTypes: componentClass.propTypes, | ||
| contextTypes: componentClass.contextTypes, | ||
| getDefaultProps: function() { return componentClass.defaultProps; }, | ||
| render: function() { return componentClass.call(this, this.props, this.context); } | ||
| })); | ||
| } | ||
| if (!componentClass) | ||
| throw new Error("Please pass a valid component to 'observer'"); | ||
| var target = componentClass.prototype || componentClass; | ||
| [ | ||
| "componentWillMount", | ||
| "componentWillUnmount", | ||
| "componentDidMount", | ||
| "componentDidUpdate" | ||
| ].forEach(function(funcName) { | ||
| patch(target, funcName) | ||
| }); | ||
| if (!target.shouldComponentUpdate) | ||
| target.shouldComponentUpdate = reactiveMixin.shouldComponentUpdate; | ||
| componentClass.isMobXReactObserver = true; | ||
| return componentClass; | ||
| } | ||
| /** | ||
| * Store provider | ||
| */ | ||
| var Provider = React.createClass({ | ||
| displayName: "Provider", | ||
| render: function() { | ||
| return React.Children.only(this.props.children); | ||
| }, | ||
| getChildContext: function () { | ||
| var stores = {}; | ||
| // inherit stores | ||
| var baseStores = this.context.mobxStores; | ||
| if (baseStores) for (var key in baseStores) { | ||
| stores[key] = baseStores[key]; | ||
| } | ||
| // add own stores | ||
| for (var key in this.props) | ||
| if (!specialReactKeys[key]) | ||
| stores[key] = this.props[key]; | ||
| return { | ||
| mobxStores: stores | ||
| }; | ||
| }, | ||
| componentWillReceiveProps: function(nextProps) { | ||
| // Maybe this warning is to aggressive? | ||
| if (Object.keys(nextProps).length !== Object.keys(this.props).length) | ||
| console.warn("MobX Provider: The set of provided stores has changed. Please avoid changing stores as the change might not propagate to all children"); | ||
| for (var key in nextProps) | ||
| if (!specialReactKeys[key] && this.props[key] !== nextProps[key]) | ||
| console.warn("MobX Provider: Provided store '" + key + "' has changed. Please avoid replacing stores as the change might not propagate to all children"); | ||
| } | ||
| }); | ||
| var PropTypes = React.PropTypes; | ||
| Provider.contextTypes = { mobxStores: PropTypes.object }; | ||
| Provider.childContextTypes = { mobxStores: PropTypes.object.isRequired }; | ||
| /** | ||
| * Store Injection | ||
| */ | ||
| function createStoreInjector(grabStoresFn, component) { | ||
| var Injector = React.createClass({ | ||
| displayName: "MobXStoreInjector", | ||
| render: function() { | ||
| var newProps = {}; | ||
| for (var key in this.props) | ||
| newProps[key] = this.props[key]; | ||
| newProps = grabStoresFn(this.context.mobxStores || {}, newProps, this.context); | ||
| return React.createElement(component, newProps); | ||
| } | ||
| // TODO: should have shouldComponentUpdate? | ||
| }); | ||
| Injector.contextTypes = { mobxStores: PropTypes.object }; | ||
| Injector.wrappedComponent = component; | ||
| return Injector; | ||
| } | ||
| /** | ||
| * higher order component that injects stores to a child. | ||
| * takes either a varargs list of strings, which are stores read from the context, | ||
| * or a function that manually maps the available stores from the context to props: | ||
| * storesToProps(mobxStores, props, context) => newProps | ||
| */ | ||
| function inject(/* fn(stores, nextProps) or ...storeNames */) { | ||
| var grabStoresFn; | ||
| if (typeof arguments[0] === "function") { | ||
| grabStoresFn = arguments[0]; | ||
| } else { | ||
| var storesNames = []; | ||
| for (var i = 0; i < arguments.length; i++) | ||
| storesNames[i] = arguments[i]; | ||
| grabStoresFn = grabStoresByName(storesNames); | ||
| } | ||
| return function(componentClass) { | ||
| return createStoreInjector(grabStoresFn, componentClass); | ||
| }; | ||
| } | ||
| function grabStoresByName(storeNames) { | ||
| return function(baseStores, nextProps) { | ||
| storeNames.forEach(function(storeName) { | ||
| if (storeName in nextProps) // prefer props over stores | ||
| return; | ||
| if (!(storeName in baseStores)) | ||
| throw new Error("MobX observer: Store '" + storeName + "' is not available! Make sure it is provided by some Provider"); | ||
| nextProps[storeName] = baseStores[storeName]; | ||
| }); | ||
| return nextProps; | ||
| } | ||
| } | ||
| /** | ||
| * PropTypes | ||
| */ | ||
| function observableTypeChecker (type) { | ||
| return function(props, propName, componentName) { | ||
| if (!mobx['isObservable' + type](props[propName])) { | ||
| return new Error( | ||
| 'Invalid prop `' + propName + '` supplied to' + | ||
| ' `' + componentName + '`. Expected a mobx observable ' + type + '. Validation failed.' | ||
| ); | ||
| } | ||
| }; | ||
| } | ||
| // oneOfType is used for simple isRequired chaining | ||
| var propTypes = { | ||
| observableArray: React.PropTypes.oneOfType([observableTypeChecker('Array')]), | ||
| observableMap: React.PropTypes.oneOfType([observableTypeChecker('Map')]), | ||
| observableObject: React.PropTypes.oneOfType([observableTypeChecker('Object')]), | ||
| arrayOrObservableArray: React.PropTypes.oneOfType([ | ||
| React.PropTypes.array, | ||
| observableTypeChecker('Array') | ||
| ]), | ||
| objectOrObservableObject: React.PropTypes.oneOfType([ | ||
| React.PropTypes.object, | ||
| observableTypeChecker('Object') | ||
| ]) | ||
| }; | ||
| /** | ||
| * Export | ||
| */ | ||
| return ({ | ||
| observer: observer, | ||
| Provider: Provider, | ||
| inject: inject, | ||
| propTypes: propTypes, | ||
| reactiveComponent: function() { | ||
| console.warn("[mobx-react] `reactiveComponent` has been renamed to `observer` and will be removed in 1.1."); | ||
| return observer.apply(null, arguments); | ||
| }, | ||
| renderReporter: renderReporter, | ||
| componentByNodeRegistery: componentByNodeRegistery, | ||
| trackComponents: trackComponents | ||
| }); | ||
| } | ||
| /** | ||
| * UMD | ||
| */ | ||
| if (typeof exports === 'object') { | ||
| module.exports = mrFactory(require('mobx'), require('react')); | ||
| } else if (typeof define === 'function' && define.amd) { | ||
| define('mobx-react', ['mobx', 'react'], mrFactory); | ||
| } else { | ||
| this.mobxReact = mrFactory(this['mobx'], this['React']); | ||
| } | ||
| })(); | ||
| !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("mobx"),require("react"),require("undefined")):"function"==typeof define&&define.amd?define(["mobx","react","undefined"],t):"object"==typeof exports?exports.mobxReact=t(require("mobx"),require("react"),require("undefined")):e.mobxReact=t(e.mobx,e.React,e.undefined)}(this,function(e,t,r){return function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){"use strict";function n(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t["default"]=e,t}function o(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0}),t.reactiveComponent=t.propTypes=t.inject=t.Provider=t.trackComponents=t.componentByNodeRegistery=t.renderReporter=t.observer=void 0;var i=arguments,a=r(1);Object.defineProperty(t,"observer",{enumerable:!0,get:function(){return a.observer}}),Object.defineProperty(t,"renderReporter",{enumerable:!0,get:function(){return a.renderReporter}}),Object.defineProperty(t,"componentByNodeRegistery",{enumerable:!0,get:function(){return a.componentByNodeRegistery}}),Object.defineProperty(t,"trackComponents",{enumerable:!0,get:function(){return a.trackComponents}});var u=r(7);Object.defineProperty(t,"Provider",{enumerable:!0,get:function(){return o(u)["default"]}});var s=r(6);Object.defineProperty(t,"inject",{enumerable:!0,get:function(){return o(s)["default"]}});var c=r(2),f=o(c),l=r(3),p=o(l),d=r(8),b=n(d),y=void 0;if(y="mobx-react/custom",!f["default"])throw new Error(y+" requires the MobX package");if(!p["default"])throw new Error(y+" requires React to be available");t.propTypes=b;t.reactiveComponent=function(){return console.warn("[mobx-react] `reactiveComponent` has been renamed to `observer` and will be removed in 1.1."),observer.apply(null,i)}},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e){return y["default"]?y["default"].findDOMNode(e):null}function i(e){var t=o(e);t&&j&&j.set(t,e),g.emit({event:"render",renderTime:e.__$mobRenderEnd-e.__$mobRenderStart,totalTime:Date.now()-e.__$mobRenderStart,component:e,node:t})}function a(){if("undefined"==typeof WeakMap)throw new Error("[mobx-react] tracking components is not supported in this browser.");x||(x=!0)}function u(e,t){var r=e[t],n=w[t];r?e[t]=function(){r.apply(this,arguments),n.apply(this,arguments)}:e[t]=n}function s(e,t){if("string"==typeof e)throw new Error("Store names should be provided as array");if(Array.isArray(e))return t?O["default"].apply(null,e)(s(t)):function(t){return s(e,t)};var r=e;if(!("function"!=typeof r||r.prototype&&r.prototype.render||r.isReactClass||d["default"].Component.isPrototypeOf(r)))return s(d["default"].createClass({displayName:r.displayName||r.name,propTypes:r.propTypes,contextTypes:r.contextTypes,getDefaultProps:function(){return r.defaultProps},render:function(){return r.call(this,this.props,this.context)}}));if(!r)throw new Error("Please pass a valid component to 'observer'");var n=r.prototype||r;return["componentWillMount","componentWillUnmount","componentDidMount","componentDidUpdate"].forEach(function(e){u(n,e)}),n.shouldComponentUpdate||(n.shouldComponentUpdate=w.shouldComponentUpdate),r.isMobXReactObserver=!0,r}Object.defineProperty(t,"__esModule",{value:!0}),t.renderReporter=t.componentByNodeRegistery=void 0;var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e};t.trackComponents=a,t.observer=s;var f=r(2),l=n(f),p=r(3),d=n(p),b=r(4),y=n(b),m=r(5),v=n(m),h=r(6),O=n(h),x=!1,j=t.componentByNodeRegistery="undefined"!=typeof WeakMap?new WeakMap:void 0,g=t.renderReporter=new v["default"],w={componentWillMount:function(){var e=this,t=this.displayName||this.name||this.constructor&&(this.constructor.displayName||this.constructor.name)||"<component>",r=this._reactInternalInstance&&this._reactInternalInstance._rootNodeID,n=this.render.bind(this),o=null,i=!1,a=function(){return o=new l["default"].Reaction(t+"#"+r+".render()",function(){i||(i=!0,"function"==typeof e.componentWillReact&&e.componentWillReact(),e.__$mobxIsUnmounted!==!0&&d["default"].Component.prototype.forceUpdate.call(e))}),u.$mobx=o,e.render=u,u()},u=function(){i=!1;var t=void 0;return o.track(function(){x&&(e.__$mobRenderStart=Date.now()),t=l["default"].extras.allowStateChanges(!1,n),x&&(e.__$mobRenderEnd=Date.now())}),t};this.render=a},componentWillUnmount:function(){if(this.render.$mobx&&this.render.$mobx.dispose(),this.__$mobxIsUnmounted=!0,x){var e=o(this);e&&j&&j["delete"](e),g.emit({event:"destroy",component:this,node:e})}},componentDidMount:function(){x&&i(this)},componentDidUpdate:function(){x&&i(this)},shouldComponentUpdate:function(e,t){if(this.render.$mobx&&this.render.$mobx.isScheduled()===!0)return!1;if(this.state!==t)return!0;var r=Object.keys(this.props);if(r.length!==Object.keys(e).length)return!0;for(var n=void 0,o=r.length-1;n=r[o];o--){var i=e[n];if(i!==this.props[n])return!0;if(i&&"object"===("undefined"==typeof i?"undefined":c(i))&&!l["default"].isObservable(i))return!0}return!1}}},function(t,r){t.exports=e},function(e,r){e.exports=t},function(e,t){e.exports=void 0},function(e,t){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n=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}}(),o=function(){function e(){r(this,e),this.listeners=[]}return n(e,[{key:"on",value:function(e){var t=this;return this.listeners.push(e),function(){var r=t.listeners.indexOf(e);r!==-1&&t.listeners.splice(r,1)}}},{key:"emit",value:function(e){this.listeners.forEach(function(t){return t(e)})}}]),e}();t["default"]=o},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){var r=s["default"].createClass({displayName:"MobXStoreInjector",render:function(){var r={};for(var n in this.props)this.props.hasOwnProperty(n)&&(r[n]=this.props[n]);return r=e(this.context.mobxStores||{},r,this.context),s["default"].createElement(t,r)}});return r.contextTypes={mobxStores:u.PropTypes.object},r.wrappedComponent=t,r}function i(e){return function(t,r){return e.forEach(function(e){if(!(e in r)){if(!(e in t))throw new Error("MobX observer: Store '"+e+"' is not available! Make sure it is provided by some Provider");r[e]=t[e]}}),r}}function a(){var e=void 0;if("function"==typeof arguments[0])e=arguments[0];else{for(var t=[],r=0;r<arguments.length;r++)t[r]=arguments[r];e=i(t)}return function(t){return o(e,t)}}Object.defineProperty(t,"__esModule",{value:!0}),t["default"]=a;var u=r(3),s=n(u)},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(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});var u=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}}(),s=r(3),c=n(s),f={children:!0,key:!0,ref:!0},l=function(e){function t(){return o(this,t),i(this,Object.getPrototypeOf(t).apply(this,arguments))}return a(t,e),u(t,[{key:"render",value:function(){return c["default"].Children.only(this.props.children)}},{key:"getChildContext",value:function(){var e={},t=this.context.mobxStores;if(t)for(var r in t)e[r]=t[r];for(var n in this.props)f[n]||(e[n]=this.props[n]);return{mobxStores:e}}},{key:"componentWillReceiveProps",value:function(e){Object.keys(e).length!==Object.keys(this.props).length&&console.warn("MobX Provider: The set of provided stores has changed. Please avoid changing stores as the change might not propagate to all children");for(var t in e)f[t]||this.props[t]===e[t]||console.warn("MobX Provider: Provided store '"+t+"' has changed. Please avoid replacing stores as the change might not propagate to all children")}}]),t}(s.Component);l.contextTypes={mobxStores:s.PropTypes.object},l.childContextTypes={mobxStores:s.PropTypes.object.isRequired},t["default"]=l},function(e,t,r){"use strict";function n(e){function t(t,r,n,o,i,a){if(o=o||ANONYMOUS,a=a||n,null==r[n]){if(t){var u=null===r[n]?"null":"undefined";return new Error("The "+i+" `"+a+"` is marked as required in `"+o+"`, but its value is `"+u+"`.")}return null}return e(r,n,o,i,a)}var r=t.bind(null,!1);return r.isRequired=t.bind(null,!0),r}function o(e,t){return"symbol"===e||("Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol)}function i(e){var t="undefined"==typeof e?"undefined":c(e);return Array.isArray(e)?"array":e instanceof RegExp?"object":o(t,e)?"symbol":t}function a(e){var t=i(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}function u(e,t){return n(function(r,n,o,u,s){if(e&&i(r[n])===t.toLowerCase())return null;var c=void 0;switch(t){case"Array":c=f.isObservableArray;break;case"Object":c=f.isObservableObject;break;case"Map":c=f.isObservableMap;break;default:throw new Error("Unexpected mobxType: "+t)}var l=r[n];if(!c(l)){var p=a(l),d=e?" or javascript `"+t.toLowerCase()+"`":"";return new Error("Invalid prop `"+s+"` of type `"+p+"` supplied to `"+o+"`, expected `mobx.Observable"+t+"`"+d+".")}return null})}function s(e,t){return n(function(r,n,o,i,a){if("function"!=typeof t)return new Error("Property `"+a+"` of component `"+o+"` has invalid PropType notation.");var s=u(e,"Array")(r,n,o);if(s instanceof Error)return s;for(var c=r[n],f=0;f<c.length;f++)if(s=t(c,f,o,i,a+"["+f+"]"),s instanceof Error)return s;return null})}Object.defineProperty(t,"__esModule",{value:!0}),t.objectOrObservableObject=t.arrayOrObservableArrayOf=t.arrayOrObservableArray=t.observableObject=t.observableMap=t.observableArrayOf=t.observableArray=void 0;var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},f=r(2);t.observableArray=u(!1,"Array"),t.observableArrayOf=s.bind(null,!1),t.observableMap=u(!1,"Map"),t.observableObject=u(!1,"Object"),t.arrayOrObservableArray=u(!0,"Array"),t.arrayOrObservableArrayOf=s.bind(null,!0),t.objectOrObservableObject=u(!0,"Object")}])}); |
401
index.js
@@ -1,400 +0,1 @@ | ||
| (function() { | ||
| function mrFactory(mobx, React, ReactDOM) { | ||
| if (!mobx) | ||
| throw new Error("mobx-react requires the MobX package") | ||
| if (!React) | ||
| throw new Error("mobx-react requires React to be available"); | ||
| /** | ||
| * dev tool support | ||
| */ | ||
| var isDevtoolsEnabled = false; | ||
| // WeakMap<Node, Object>; | ||
| var componentByNodeRegistery = typeof WeakMap !== "undefined" ? new WeakMap() : undefined; | ||
| var renderReporter = new EventEmitter(); | ||
| function findDOMNode(component) { | ||
| if (ReactDOM) | ||
| return ReactDOM.findDOMNode(component); | ||
| return null; | ||
| } | ||
| function reportRendering(component) { | ||
| var node = findDOMNode(component); | ||
| if (node && componentByNodeRegistery) | ||
| componentByNodeRegistery.set(node, component); | ||
| renderReporter.emit({ | ||
| event: 'render', | ||
| renderTime: component.__$mobRenderEnd - component.__$mobRenderStart, | ||
| totalTime: Date.now() - component.__$mobRenderStart, | ||
| component: component, | ||
| node: node | ||
| }); | ||
| } | ||
| function trackComponents() { | ||
| if (typeof WeakMap === "undefined") | ||
| throw new Error("[mobx-react] tracking components is not supported in this browser."); | ||
| if (!isDevtoolsEnabled) | ||
| isDevtoolsEnabled = true; | ||
| } | ||
| function EventEmitter() { | ||
| this.listeners = []; | ||
| }; | ||
| EventEmitter.prototype.on = function (cb) { | ||
| this.listeners.push(cb); | ||
| var self = this; | ||
| return function() { | ||
| var idx = self.listeners.indexOf(cb); | ||
| if (idx !== -1) | ||
| self.listeners.splice(idx, 1); | ||
| }; | ||
| }; | ||
| EventEmitter.prototype.emit = function(data) { | ||
| this.listeners.forEach(function (fn) { | ||
| fn(data); | ||
| }); | ||
| }; | ||
| /** | ||
| * Utilities | ||
| */ | ||
| var specialReactKeys = { children: true, key: true, ref: true }; | ||
| function patch(target, funcName) { | ||
| var base = target[funcName]; | ||
| var mixinFunc = reactiveMixin[funcName]; | ||
| if (!base) { | ||
| target[funcName] = mixinFunc; | ||
| } else { | ||
| target[funcName] = function() { | ||
| base.apply(this, arguments); | ||
| mixinFunc.apply(this, arguments); | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * ReactiveMixin | ||
| */ | ||
| var reactiveMixin = { | ||
| componentWillMount: function() { | ||
| // Generate friendly name for debugging | ||
| var name = [ | ||
| this.displayName || this.name || (this.constructor && (this.constructor.displayName || this.constructor.name)) || "<component>", | ||
| "#", this._reactInternalInstance && this._reactInternalInstance._rootNodeID, | ||
| ".render()" | ||
| ].join(""); | ||
| var baseRender = this.render.bind(this); | ||
| var self = this; | ||
| var reaction = null; | ||
| var isRenderingPending = false; | ||
| function initialRender() { | ||
| reaction = new mobx.Reaction(name, function() { | ||
| if (!isRenderingPending) { | ||
| // N.B. Getting here *before mounting* means that a component constructor has side effects (see the relevant test in misc.js) | ||
| // This unidiomatic React usage but React will correctly warn about this so we continue as usual | ||
| // See #85 / Pull #44 | ||
| isRenderingPending = true; | ||
| if (typeof self.componentWillReact === "function") | ||
| self.componentWillReact(); // TODO: wrap in action? | ||
| if (self.__$mobxIsUnmounted !== true) { | ||
| // If we are unmounted at this point, componentWillReact() had a side effect causing the component to unmounted | ||
| // TODO: remove this check? Then react will properly warn about the fact that this should not happen? See #73 | ||
| // However, people also claim this migth happen during unit tests.. | ||
| React.Component.prototype.forceUpdate.call(self) | ||
| } | ||
| } | ||
| }); | ||
| reactiveRender.$mobx = reaction; | ||
| self.render = reactiveRender; | ||
| return reactiveRender(); | ||
| } | ||
| function reactiveRender() { | ||
| isRenderingPending = false; | ||
| var rendering; | ||
| reaction.track(function() { | ||
| if (isDevtoolsEnabled) | ||
| self.__$mobRenderStart = Date.now(); | ||
| rendering = mobx.extras.allowStateChanges(false, baseRender); | ||
| if (isDevtoolsEnabled) | ||
| self.__$mobRenderEnd = Date.now(); | ||
| }); | ||
| return rendering; | ||
| } | ||
| this.render = initialRender; | ||
| }, | ||
| componentWillUnmount: function() { | ||
| this.render.$mobx && this.render.$mobx.dispose(); | ||
| this.__$mobxIsUnmounted = true; | ||
| if (isDevtoolsEnabled) { | ||
| var node = findDOMNode(this); | ||
| if (node && componentByNodeRegistery) { | ||
| componentByNodeRegistery.delete(node); | ||
| } | ||
| renderReporter.emit({ | ||
| event: 'destroy', | ||
| component: this, | ||
| node: node | ||
| }); | ||
| } | ||
| }, | ||
| componentDidMount: function() { | ||
| if (isDevtoolsEnabled) | ||
| reportRendering(this); | ||
| }, | ||
| componentDidUpdate: function() { | ||
| if (isDevtoolsEnabled) | ||
| reportRendering(this); | ||
| }, | ||
| shouldComponentUpdate: function(nextProps, nextState) { | ||
| // TODO: if context changed, return true.., see #18 | ||
| // if props or state did change, but a render was scheduled already, no additional render needs to be scheduled | ||
| if (this.render.$mobx && this.render.$mobx.isScheduled() === true) | ||
| return false; | ||
| // update on any state changes (as is the default) | ||
| if (this.state !== nextState) | ||
| return true; | ||
| // update if props are shallowly not equal, inspired by PureRenderMixin | ||
| var keys = Object.keys(this.props); | ||
| var key; | ||
| if (keys.length !== Object.keys(nextProps).length) | ||
| return true; | ||
| for(var i = keys.length -1; i >= 0, key = keys[i]; i--) { | ||
| var newValue = nextProps[key]; | ||
| if (newValue !== this.props[key]) { | ||
| return true; | ||
| } else if (newValue && typeof newValue === "object" && !mobx.isObservable(newValue)) { | ||
| /** | ||
| * If the newValue is still the same object, but that object is not observable, | ||
| * fallback to the default React behavior: update, because the object *might* have changed. | ||
| * If you need the non default behavior, just use the React pure render mixin, as that one | ||
| * will work fine with mobx as well, instead of the default implementation of | ||
| * observer. | ||
| */ | ||
| return true; | ||
| } | ||
| } | ||
| return false; | ||
| } | ||
| } | ||
| /** | ||
| * Observer function / decorator | ||
| */ | ||
| function observer(arg1, arg2) { | ||
| if (typeof arg1 === "string") | ||
| throw new Error("Store names should be provided as array"); | ||
| if (Array.isArray(arg1)) { | ||
| // component needs stores | ||
| if (!arg2) { | ||
| // invoked as decorator | ||
| return function(componentClass) { | ||
| return observer(arg1, componentClass); | ||
| } | ||
| } else { | ||
| // TODO: deprecate this invocation style | ||
| return inject.apply(null, arg1)(observer(arg2)); | ||
| } | ||
| } | ||
| var componentClass = arg1; | ||
| // Stateless function component: | ||
| // If it is function but doesn't seem to be a react class constructor, | ||
| // wrap it to a react class automatically | ||
| if ( | ||
| typeof componentClass === "function" && | ||
| (!componentClass.prototype || !componentClass.prototype.render) && | ||
| !componentClass.isReactClass && | ||
| !React.Component.isPrototypeOf(componentClass) | ||
| ) { | ||
| return observer(React.createClass({ | ||
| displayName: componentClass.displayName || componentClass.name, | ||
| propTypes: componentClass.propTypes, | ||
| contextTypes: componentClass.contextTypes, | ||
| getDefaultProps: function() { return componentClass.defaultProps; }, | ||
| render: function() { return componentClass.call(this, this.props, this.context); } | ||
| })); | ||
| } | ||
| if (!componentClass) | ||
| throw new Error("Please pass a valid component to 'observer'"); | ||
| var target = componentClass.prototype || componentClass; | ||
| [ | ||
| "componentWillMount", | ||
| "componentWillUnmount", | ||
| "componentDidMount", | ||
| "componentDidUpdate" | ||
| ].forEach(function(funcName) { | ||
| patch(target, funcName) | ||
| }); | ||
| if (!target.shouldComponentUpdate) | ||
| target.shouldComponentUpdate = reactiveMixin.shouldComponentUpdate; | ||
| componentClass.isMobXReactObserver = true; | ||
| return componentClass; | ||
| } | ||
| /** | ||
| * Store provider | ||
| */ | ||
| var Provider = React.createClass({ | ||
| displayName: "Provider", | ||
| render: function() { | ||
| return React.Children.only(this.props.children); | ||
| }, | ||
| getChildContext: function () { | ||
| var stores = {}; | ||
| // inherit stores | ||
| var baseStores = this.context.mobxStores; | ||
| if (baseStores) for (var key in baseStores) { | ||
| stores[key] = baseStores[key]; | ||
| } | ||
| // add own stores | ||
| for (var key in this.props) | ||
| if (!specialReactKeys[key]) | ||
| stores[key] = this.props[key]; | ||
| return { | ||
| mobxStores: stores | ||
| }; | ||
| }, | ||
| componentWillReceiveProps: function(nextProps) { | ||
| // Maybe this warning is to aggressive? | ||
| if (Object.keys(nextProps).length !== Object.keys(this.props).length) | ||
| console.warn("MobX Provider: The set of provided stores has changed. Please avoid changing stores as the change might not propagate to all children"); | ||
| for (var key in nextProps) | ||
| if (!specialReactKeys[key] && this.props[key] !== nextProps[key]) | ||
| console.warn("MobX Provider: Provided store '" + key + "' has changed. Please avoid replacing stores as the change might not propagate to all children"); | ||
| } | ||
| }); | ||
| var PropTypes = React.PropTypes; | ||
| Provider.contextTypes = { mobxStores: PropTypes.object }; | ||
| Provider.childContextTypes = { mobxStores: PropTypes.object.isRequired }; | ||
| /** | ||
| * Store Injection | ||
| */ | ||
| function createStoreInjector(grabStoresFn, component) { | ||
| var Injector = React.createClass({ | ||
| displayName: "MobXStoreInjector", | ||
| render: function() { | ||
| var newProps = {}; | ||
| for (var key in this.props) | ||
| newProps[key] = this.props[key]; | ||
| newProps = grabStoresFn(this.context.mobxStores || {}, newProps, this.context); | ||
| return React.createElement(component, newProps); | ||
| } | ||
| // TODO: should have shouldComponentUpdate? | ||
| }); | ||
| Injector.contextTypes = { mobxStores: PropTypes.object }; | ||
| Injector.wrappedComponent = component; | ||
| return Injector; | ||
| } | ||
| /** | ||
| * higher order component that injects stores to a child. | ||
| * takes either a varargs list of strings, which are stores read from the context, | ||
| * or a function that manually maps the available stores from the context to props: | ||
| * storesToProps(mobxStores, props, context) => newProps | ||
| */ | ||
| function inject(/* fn(stores, nextProps) or ...storeNames */) { | ||
| var grabStoresFn; | ||
| if (typeof arguments[0] === "function") { | ||
| grabStoresFn = arguments[0]; | ||
| } else { | ||
| var storesNames = []; | ||
| for (var i = 0; i < arguments.length; i++) | ||
| storesNames[i] = arguments[i]; | ||
| grabStoresFn = grabStoresByName(storesNames); | ||
| } | ||
| return function(componentClass) { | ||
| return createStoreInjector(grabStoresFn, componentClass); | ||
| }; | ||
| } | ||
| function grabStoresByName(storeNames) { | ||
| return function(baseStores, nextProps) { | ||
| storeNames.forEach(function(storeName) { | ||
| if (storeName in nextProps) // prefer props over stores | ||
| return; | ||
| if (!(storeName in baseStores)) | ||
| throw new Error("MobX observer: Store '" + storeName + "' is not available! Make sure it is provided by some Provider"); | ||
| nextProps[storeName] = baseStores[storeName]; | ||
| }); | ||
| return nextProps; | ||
| } | ||
| } | ||
| /** | ||
| * PropTypes | ||
| */ | ||
| function observableTypeChecker (type) { | ||
| return function(props, propName, componentName) { | ||
| if (!mobx['isObservable' + type](props[propName])) { | ||
| return new Error( | ||
| 'Invalid prop `' + propName + '` supplied to' + | ||
| ' `' + componentName + '`. Expected a mobx observable ' + type + '. Validation failed.' | ||
| ); | ||
| } | ||
| }; | ||
| } | ||
| // oneOfType is used for simple isRequired chaining | ||
| var propTypes = { | ||
| observableArray: React.PropTypes.oneOfType([observableTypeChecker('Array')]), | ||
| observableMap: React.PropTypes.oneOfType([observableTypeChecker('Map')]), | ||
| observableObject: React.PropTypes.oneOfType([observableTypeChecker('Object')]), | ||
| arrayOrObservableArray: React.PropTypes.oneOfType([ | ||
| React.PropTypes.array, | ||
| observableTypeChecker('Array') | ||
| ]), | ||
| objectOrObservableObject: React.PropTypes.oneOfType([ | ||
| React.PropTypes.object, | ||
| observableTypeChecker('Object') | ||
| ]) | ||
| }; | ||
| /** | ||
| * Export | ||
| */ | ||
| return ({ | ||
| observer: observer, | ||
| Provider: Provider, | ||
| inject: inject, | ||
| propTypes: propTypes, | ||
| reactiveComponent: function() { | ||
| console.warn("[mobx-react] `reactiveComponent` has been renamed to `observer` and will be removed in 1.1."); | ||
| return observer.apply(null, arguments); | ||
| }, | ||
| renderReporter: renderReporter, | ||
| componentByNodeRegistery: componentByNodeRegistery, | ||
| trackComponents: trackComponents | ||
| }); | ||
| } | ||
| /** | ||
| * UMD | ||
| */ | ||
| if (typeof exports === 'object') { | ||
| module.exports = mrFactory(require('mobx'), require('react'), require('react-dom')); | ||
| } else if (typeof define === 'function' && define.amd) { | ||
| define('mobx-react', ['mobx', 'react', 'react-dom'], mrFactory); | ||
| } else { | ||
| this.mobxReact = mrFactory(this['mobx'], this['React'], this['ReactDOM']); | ||
| } | ||
| })(); | ||
| !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("mobx"),require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["mobx","react","react-dom"],t):"object"==typeof exports?exports.mobxReact=t(require("mobx"),require("react"),require("react-dom")):e.mobxReact=t(e.mobx,e.React,e.ReactDOM)}(this,function(e,t,r){return function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){"use strict";function n(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t["default"]=e,t}function o(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0}),t.reactiveComponent=t.propTypes=t.inject=t.Provider=t.trackComponents=t.componentByNodeRegistery=t.renderReporter=t.observer=void 0;var i=arguments,a=r(1);Object.defineProperty(t,"observer",{enumerable:!0,get:function(){return a.observer}}),Object.defineProperty(t,"renderReporter",{enumerable:!0,get:function(){return a.renderReporter}}),Object.defineProperty(t,"componentByNodeRegistery",{enumerable:!0,get:function(){return a.componentByNodeRegistery}}),Object.defineProperty(t,"trackComponents",{enumerable:!0,get:function(){return a.trackComponents}});var u=r(7);Object.defineProperty(t,"Provider",{enumerable:!0,get:function(){return o(u)["default"]}});var s=r(6);Object.defineProperty(t,"inject",{enumerable:!0,get:function(){return o(s)["default"]}});var c=r(2),f=o(c),l=r(3),p=o(l),d=r(8),b=n(d),y=void 0;if(y="mobx-react",!f["default"])throw new Error(y+" requires the MobX package");if(!p["default"])throw new Error(y+" requires React to be available");t.propTypes=b;t.reactiveComponent=function(){return console.warn("[mobx-react] `reactiveComponent` has been renamed to `observer` and will be removed in 1.1."),observer.apply(null,i)}},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e){return y["default"]?y["default"].findDOMNode(e):null}function i(e){var t=o(e);t&&j&&j.set(t,e),g.emit({event:"render",renderTime:e.__$mobRenderEnd-e.__$mobRenderStart,totalTime:Date.now()-e.__$mobRenderStart,component:e,node:t})}function a(){if("undefined"==typeof WeakMap)throw new Error("[mobx-react] tracking components is not supported in this browser.");x||(x=!0)}function u(e,t){var r=e[t],n=w[t];r?e[t]=function(){r.apply(this,arguments),n.apply(this,arguments)}:e[t]=n}function s(e,t){if("string"==typeof e)throw new Error("Store names should be provided as array");if(Array.isArray(e))return t?O["default"].apply(null,e)(s(t)):function(t){return s(e,t)};var r=e;if(!("function"!=typeof r||r.prototype&&r.prototype.render||r.isReactClass||d["default"].Component.isPrototypeOf(r)))return s(d["default"].createClass({displayName:r.displayName||r.name,propTypes:r.propTypes,contextTypes:r.contextTypes,getDefaultProps:function(){return r.defaultProps},render:function(){return r.call(this,this.props,this.context)}}));if(!r)throw new Error("Please pass a valid component to 'observer'");var n=r.prototype||r;return["componentWillMount","componentWillUnmount","componentDidMount","componentDidUpdate"].forEach(function(e){u(n,e)}),n.shouldComponentUpdate||(n.shouldComponentUpdate=w.shouldComponentUpdate),r.isMobXReactObserver=!0,r}Object.defineProperty(t,"__esModule",{value:!0}),t.renderReporter=t.componentByNodeRegistery=void 0;var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e};t.trackComponents=a,t.observer=s;var f=r(2),l=n(f),p=r(3),d=n(p),b=r(4),y=n(b),m=r(5),v=n(m),h=r(6),O=n(h),x=!1,j=t.componentByNodeRegistery="undefined"!=typeof WeakMap?new WeakMap:void 0,g=t.renderReporter=new v["default"],w={componentWillMount:function(){var e=this,t=this.displayName||this.name||this.constructor&&(this.constructor.displayName||this.constructor.name)||"<component>",r=this._reactInternalInstance&&this._reactInternalInstance._rootNodeID,n=this.render.bind(this),o=null,i=!1,a=function(){return o=new l["default"].Reaction(t+"#"+r+".render()",function(){i||(i=!0,"function"==typeof e.componentWillReact&&e.componentWillReact(),e.__$mobxIsUnmounted!==!0&&d["default"].Component.prototype.forceUpdate.call(e))}),u.$mobx=o,e.render=u,u()},u=function(){i=!1;var t=void 0;return o.track(function(){x&&(e.__$mobRenderStart=Date.now()),t=l["default"].extras.allowStateChanges(!1,n),x&&(e.__$mobRenderEnd=Date.now())}),t};this.render=a},componentWillUnmount:function(){if(this.render.$mobx&&this.render.$mobx.dispose(),this.__$mobxIsUnmounted=!0,x){var e=o(this);e&&j&&j["delete"](e),g.emit({event:"destroy",component:this,node:e})}},componentDidMount:function(){x&&i(this)},componentDidUpdate:function(){x&&i(this)},shouldComponentUpdate:function(e,t){if(this.render.$mobx&&this.render.$mobx.isScheduled()===!0)return!1;if(this.state!==t)return!0;var r=Object.keys(this.props);if(r.length!==Object.keys(e).length)return!0;for(var n=void 0,o=r.length-1;n=r[o];o--){var i=e[n];if(i!==this.props[n])return!0;if(i&&"object"===("undefined"==typeof i?"undefined":c(i))&&!l["default"].isObservable(i))return!0}return!1}}},function(t,r){t.exports=e},function(e,r){e.exports=t},function(e,t){e.exports=r},function(e,t){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n=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}}(),o=function(){function e(){r(this,e),this.listeners=[]}return n(e,[{key:"on",value:function(e){var t=this;return this.listeners.push(e),function(){var r=t.listeners.indexOf(e);r!==-1&&t.listeners.splice(r,1)}}},{key:"emit",value:function(e){this.listeners.forEach(function(t){return t(e)})}}]),e}();t["default"]=o},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){var r=s["default"].createClass({displayName:"MobXStoreInjector",render:function(){var r={};for(var n in this.props)this.props.hasOwnProperty(n)&&(r[n]=this.props[n]);return r=e(this.context.mobxStores||{},r,this.context),s["default"].createElement(t,r)}});return r.contextTypes={mobxStores:u.PropTypes.object},r.wrappedComponent=t,r}function i(e){return function(t,r){return e.forEach(function(e){if(!(e in r)){if(!(e in t))throw new Error("MobX observer: Store '"+e+"' is not available! Make sure it is provided by some Provider");r[e]=t[e]}}),r}}function a(){var e=void 0;if("function"==typeof arguments[0])e=arguments[0];else{for(var t=[],r=0;r<arguments.length;r++)t[r]=arguments[r];e=i(t)}return function(t){return o(e,t)}}Object.defineProperty(t,"__esModule",{value:!0}),t["default"]=a;var u=r(3),s=n(u)},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(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});var u=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}}(),s=r(3),c=n(s),f={children:!0,key:!0,ref:!0},l=function(e){function t(){return o(this,t),i(this,Object.getPrototypeOf(t).apply(this,arguments))}return a(t,e),u(t,[{key:"render",value:function(){return c["default"].Children.only(this.props.children)}},{key:"getChildContext",value:function(){var e={},t=this.context.mobxStores;if(t)for(var r in t)e[r]=t[r];for(var n in this.props)f[n]||(e[n]=this.props[n]);return{mobxStores:e}}},{key:"componentWillReceiveProps",value:function(e){Object.keys(e).length!==Object.keys(this.props).length&&console.warn("MobX Provider: The set of provided stores has changed. Please avoid changing stores as the change might not propagate to all children");for(var t in e)f[t]||this.props[t]===e[t]||console.warn("MobX Provider: Provided store '"+t+"' has changed. Please avoid replacing stores as the change might not propagate to all children")}}]),t}(s.Component);l.contextTypes={mobxStores:s.PropTypes.object},l.childContextTypes={mobxStores:s.PropTypes.object.isRequired},t["default"]=l},function(e,t,r){"use strict";function n(e){function t(t,r,n,o,i,a){if(o=o||ANONYMOUS,a=a||n,null==r[n]){if(t){var u=null===r[n]?"null":"undefined";return new Error("The "+i+" `"+a+"` is marked as required in `"+o+"`, but its value is `"+u+"`.")}return null}return e(r,n,o,i,a)}var r=t.bind(null,!1);return r.isRequired=t.bind(null,!0),r}function o(e,t){return"symbol"===e||("Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol)}function i(e){var t="undefined"==typeof e?"undefined":c(e);return Array.isArray(e)?"array":e instanceof RegExp?"object":o(t,e)?"symbol":t}function a(e){var t=i(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}function u(e,t){return n(function(r,n,o,u,s){if(e&&i(r[n])===t.toLowerCase())return null;var c=void 0;switch(t){case"Array":c=f.isObservableArray;break;case"Object":c=f.isObservableObject;break;case"Map":c=f.isObservableMap;break;default:throw new Error("Unexpected mobxType: "+t)}var l=r[n];if(!c(l)){var p=a(l),d=e?" or javascript `"+t.toLowerCase()+"`":"";return new Error("Invalid prop `"+s+"` of type `"+p+"` supplied to `"+o+"`, expected `mobx.Observable"+t+"`"+d+".")}return null})}function s(e,t){return n(function(r,n,o,i,a){if("function"!=typeof t)return new Error("Property `"+a+"` of component `"+o+"` has invalid PropType notation.");var s=u(e,"Array")(r,n,o);if(s instanceof Error)return s;for(var c=r[n],f=0;f<c.length;f++)if(s=t(c,f,o,i,a+"["+f+"]"),s instanceof Error)return s;return null})}Object.defineProperty(t,"__esModule",{value:!0}),t.objectOrObservableObject=t.arrayOrObservableArrayOf=t.arrayOrObservableArray=t.observableObject=t.observableMap=t.observableArrayOf=t.observableArray=void 0;var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},f=r(2);t.observableArray=u(!1,"Array"),t.observableArrayOf=s.bind(null,!1),t.observableMap=u(!1,"Map"),t.observableObject=u(!1,"Object"),t.arrayOrObservableArray=u(!0,"Array"),t.arrayOrObservableArrayOf=s.bind(null,!0),t.objectOrObservableObject=u(!0,"Object")}])}); |
401
native.js
@@ -1,400 +0,1 @@ | ||
| (function() { | ||
| function mrFactory(mobx, React, ReactDOM) { | ||
| if (!mobx) | ||
| throw new Error("mobx-react requires the MobX package") | ||
| if (!React) | ||
| throw new Error("mobx-react/native requires React Native to be available"); | ||
| /** | ||
| * dev tool support | ||
| */ | ||
| var isDevtoolsEnabled = false; | ||
| // WeakMap<Node, Object>; | ||
| var componentByNodeRegistery = typeof WeakMap !== "undefined" ? new WeakMap() : undefined; | ||
| var renderReporter = new EventEmitter(); | ||
| function findDOMNode(component) { | ||
| if (ReactDOM) | ||
| return ReactDOM.findDOMNode(component); | ||
| return null; | ||
| } | ||
| function reportRendering(component) { | ||
| var node = findDOMNode(component); | ||
| if (node && componentByNodeRegistery) | ||
| componentByNodeRegistery.set(node, component); | ||
| renderReporter.emit({ | ||
| event: 'render', | ||
| renderTime: component.__$mobRenderEnd - component.__$mobRenderStart, | ||
| totalTime: Date.now() - component.__$mobRenderStart, | ||
| component: component, | ||
| node: node | ||
| }); | ||
| } | ||
| function trackComponents() { | ||
| if (typeof WeakMap === "undefined") | ||
| throw new Error("[mobx-react] tracking components is not supported in this browser."); | ||
| if (!isDevtoolsEnabled) | ||
| isDevtoolsEnabled = true; | ||
| } | ||
| function EventEmitter() { | ||
| this.listeners = []; | ||
| }; | ||
| EventEmitter.prototype.on = function (cb) { | ||
| this.listeners.push(cb); | ||
| var self = this; | ||
| return function() { | ||
| var idx = self.listeners.indexOf(cb); | ||
| if (idx !== -1) | ||
| self.listeners.splice(idx, 1); | ||
| }; | ||
| }; | ||
| EventEmitter.prototype.emit = function(data) { | ||
| this.listeners.forEach(function (fn) { | ||
| fn(data); | ||
| }); | ||
| }; | ||
| /** | ||
| * Utilities | ||
| */ | ||
| var specialReactKeys = { children: true, key: true, ref: true }; | ||
| function patch(target, funcName) { | ||
| var base = target[funcName]; | ||
| var mixinFunc = reactiveMixin[funcName]; | ||
| if (!base) { | ||
| target[funcName] = mixinFunc; | ||
| } else { | ||
| target[funcName] = function() { | ||
| base.apply(this, arguments); | ||
| mixinFunc.apply(this, arguments); | ||
| } | ||
| } | ||
| } | ||
| /** | ||
| * ReactiveMixin | ||
| */ | ||
| var reactiveMixin = { | ||
| componentWillMount: function() { | ||
| // Generate friendly name for debugging | ||
| var name = [ | ||
| this.displayName || this.name || (this.constructor && (this.constructor.displayName || this.constructor.name)) || "<component>", | ||
| "#", this._reactInternalInstance && this._reactInternalInstance._rootNodeID, | ||
| ".render()" | ||
| ].join(""); | ||
| var baseRender = this.render.bind(this); | ||
| var self = this; | ||
| var reaction = null; | ||
| var isRenderingPending = false; | ||
| function initialRender() { | ||
| reaction = new mobx.Reaction(name, function() { | ||
| if (!isRenderingPending) { | ||
| // N.B. Getting here *before mounting* means that a component constructor has side effects (see the relevant test in misc.js) | ||
| // This unidiomatic React usage but React will correctly warn about this so we continue as usual | ||
| // See #85 / Pull #44 | ||
| isRenderingPending = true; | ||
| if (typeof self.componentWillReact === "function") | ||
| self.componentWillReact(); // TODO: wrap in action? | ||
| if (self.__$mobxIsUnmounted !== true) { | ||
| // If we are unmounted at this point, componentWillReact() had a side effect causing the component to unmounted | ||
| // TODO: remove this check? Then react will properly warn about the fact that this should not happen? See #73 | ||
| // However, people also claim this migth happen during unit tests.. | ||
| React.Component.prototype.forceUpdate.call(self) | ||
| } | ||
| } | ||
| }); | ||
| reactiveRender.$mobx = reaction; | ||
| self.render = reactiveRender; | ||
| return reactiveRender(); | ||
| } | ||
| function reactiveRender() { | ||
| isRenderingPending = false; | ||
| var rendering; | ||
| reaction.track(function() { | ||
| if (isDevtoolsEnabled) | ||
| self.__$mobRenderStart = Date.now(); | ||
| rendering = mobx.extras.allowStateChanges(false, baseRender); | ||
| if (isDevtoolsEnabled) | ||
| self.__$mobRenderEnd = Date.now(); | ||
| }); | ||
| return rendering; | ||
| } | ||
| this.render = initialRender; | ||
| }, | ||
| componentWillUnmount: function() { | ||
| this.render.$mobx && this.render.$mobx.dispose(); | ||
| this.__$mobxIsUnmounted = true; | ||
| if (isDevtoolsEnabled) { | ||
| var node = findDOMNode(this); | ||
| if (node && componentByNodeRegistery) { | ||
| componentByNodeRegistery.delete(node); | ||
| } | ||
| renderReporter.emit({ | ||
| event: 'destroy', | ||
| component: this, | ||
| node: node | ||
| }); | ||
| } | ||
| }, | ||
| componentDidMount: function() { | ||
| if (isDevtoolsEnabled) | ||
| reportRendering(this); | ||
| }, | ||
| componentDidUpdate: function() { | ||
| if (isDevtoolsEnabled) | ||
| reportRendering(this); | ||
| }, | ||
| shouldComponentUpdate: function(nextProps, nextState) { | ||
| // TODO: if context changed, return true.., see #18 | ||
| // if props or state did change, but a render was scheduled already, no additional render needs to be scheduled | ||
| if (this.render.$mobx && this.render.$mobx.isScheduled() === true) | ||
| return false; | ||
| // update on any state changes (as is the default) | ||
| if (this.state !== nextState) | ||
| return true; | ||
| // update if props are shallowly not equal, inspired by PureRenderMixin | ||
| var keys = Object.keys(this.props); | ||
| var key; | ||
| if (keys.length !== Object.keys(nextProps).length) | ||
| return true; | ||
| for(var i = keys.length -1; i >= 0, key = keys[i]; i--) { | ||
| var newValue = nextProps[key]; | ||
| if (newValue !== this.props[key]) { | ||
| return true; | ||
| } else if (newValue && typeof newValue === "object" && !mobx.isObservable(newValue)) { | ||
| /** | ||
| * If the newValue is still the same object, but that object is not observable, | ||
| * fallback to the default React behavior: update, because the object *might* have changed. | ||
| * If you need the non default behavior, just use the React pure render mixin, as that one | ||
| * will work fine with mobx as well, instead of the default implementation of | ||
| * observer. | ||
| */ | ||
| return true; | ||
| } | ||
| } | ||
| return false; | ||
| } | ||
| } | ||
| /** | ||
| * Observer function / decorator | ||
| */ | ||
| function observer(arg1, arg2) { | ||
| if (typeof arg1 === "string") | ||
| throw new Error("Store names should be provided as array"); | ||
| if (Array.isArray(arg1)) { | ||
| // component needs stores | ||
| if (!arg2) { | ||
| // invoked as decorator | ||
| return function(componentClass) { | ||
| return observer(arg1, componentClass); | ||
| } | ||
| } else { | ||
| // TODO: deprecate this invocation style | ||
| return inject.apply(null, arg1)(observer(arg2)); | ||
| } | ||
| } | ||
| var componentClass = arg1; | ||
| // Stateless function component: | ||
| // If it is function but doesn't seem to be a react class constructor, | ||
| // wrap it to a react class automatically | ||
| if ( | ||
| typeof componentClass === "function" && | ||
| (!componentClass.prototype || !componentClass.prototype.render) && | ||
| !componentClass.isReactClass && | ||
| !React.Component.isPrototypeOf(componentClass) | ||
| ) { | ||
| return observer(React.createClass({ | ||
| displayName: componentClass.displayName || componentClass.name, | ||
| propTypes: componentClass.propTypes, | ||
| contextTypes: componentClass.contextTypes, | ||
| getDefaultProps: function() { return componentClass.defaultProps; }, | ||
| render: function() { return componentClass.call(this, this.props, this.context); } | ||
| })); | ||
| } | ||
| if (!componentClass) | ||
| throw new Error("Please pass a valid component to 'observer'"); | ||
| var target = componentClass.prototype || componentClass; | ||
| [ | ||
| "componentWillMount", | ||
| "componentWillUnmount", | ||
| "componentDidMount", | ||
| "componentDidUpdate" | ||
| ].forEach(function(funcName) { | ||
| patch(target, funcName) | ||
| }); | ||
| if (!target.shouldComponentUpdate) | ||
| target.shouldComponentUpdate = reactiveMixin.shouldComponentUpdate; | ||
| componentClass.isMobXReactObserver = true; | ||
| return componentClass; | ||
| } | ||
| /** | ||
| * Store provider | ||
| */ | ||
| var Provider = React.createClass({ | ||
| displayName: "Provider", | ||
| render: function() { | ||
| return React.Children.only(this.props.children); | ||
| }, | ||
| getChildContext: function () { | ||
| var stores = {}; | ||
| // inherit stores | ||
| var baseStores = this.context.mobxStores; | ||
| if (baseStores) for (var key in baseStores) { | ||
| stores[key] = baseStores[key]; | ||
| } | ||
| // add own stores | ||
| for (var key in this.props) | ||
| if (!specialReactKeys[key]) | ||
| stores[key] = this.props[key]; | ||
| return { | ||
| mobxStores: stores | ||
| }; | ||
| }, | ||
| componentWillReceiveProps: function(nextProps) { | ||
| // Maybe this warning is to aggressive? | ||
| if (Object.keys(nextProps).length !== Object.keys(this.props).length) | ||
| console.warn("MobX Provider: The set of provided stores has changed. Please avoid changing stores as the change might not propagate to all children"); | ||
| for (var key in nextProps) | ||
| if (!specialReactKeys[key] && this.props[key] !== nextProps[key]) | ||
| console.warn("MobX Provider: Provided store '" + key + "' has changed. Please avoid replacing stores as the change might not propagate to all children"); | ||
| } | ||
| }); | ||
| var PropTypes = React.PropTypes; | ||
| Provider.contextTypes = { mobxStores: PropTypes.object }; | ||
| Provider.childContextTypes = { mobxStores: PropTypes.object.isRequired }; | ||
| /** | ||
| * Store Injection | ||
| */ | ||
| function createStoreInjector(grabStoresFn, component) { | ||
| var Injector = React.createClass({ | ||
| displayName: "MobXStoreInjector", | ||
| render: function() { | ||
| var newProps = {}; | ||
| for (var key in this.props) | ||
| newProps[key] = this.props[key]; | ||
| newProps = grabStoresFn(this.context.mobxStores || {}, newProps, this.context); | ||
| return React.createElement(component, newProps); | ||
| } | ||
| // TODO: should have shouldComponentUpdate? | ||
| }); | ||
| Injector.contextTypes = { mobxStores: PropTypes.object }; | ||
| Injector.wrappedComponent = component; | ||
| return Injector; | ||
| } | ||
| /** | ||
| * higher order component that injects stores to a child. | ||
| * takes either a varargs list of strings, which are stores read from the context, | ||
| * or a function that manually maps the available stores from the context to props: | ||
| * storesToProps(mobxStores, props, context) => newProps | ||
| */ | ||
| function inject(/* fn(stores, nextProps) or ...storeNames */) { | ||
| var grabStoresFn; | ||
| if (typeof arguments[0] === "function") { | ||
| grabStoresFn = arguments[0]; | ||
| } else { | ||
| var storesNames = []; | ||
| for (var i = 0; i < arguments.length; i++) | ||
| storesNames[i] = arguments[i]; | ||
| grabStoresFn = grabStoresByName(storesNames); | ||
| } | ||
| return function(componentClass) { | ||
| return createStoreInjector(grabStoresFn, componentClass); | ||
| }; | ||
| } | ||
| function grabStoresByName(storeNames) { | ||
| return function(baseStores, nextProps) { | ||
| storeNames.forEach(function(storeName) { | ||
| if (storeName in nextProps) // prefer props over stores | ||
| return; | ||
| if (!(storeName in baseStores)) | ||
| throw new Error("MobX observer: Store '" + storeName + "' is not available! Make sure it is provided by some Provider"); | ||
| nextProps[storeName] = baseStores[storeName]; | ||
| }); | ||
| return nextProps; | ||
| } | ||
| } | ||
| /** | ||
| * PropTypes | ||
| */ | ||
| function observableTypeChecker (type) { | ||
| return function(props, propName, componentName) { | ||
| if (!mobx['isObservable' + type](props[propName])) { | ||
| return new Error( | ||
| 'Invalid prop `' + propName + '` supplied to' + | ||
| ' `' + componentName + '`. Expected a mobx observable ' + type + '. Validation failed.' | ||
| ); | ||
| } | ||
| }; | ||
| } | ||
| // oneOfType is used for simple isRequired chaining | ||
| var propTypes = { | ||
| observableArray: React.PropTypes.oneOfType([observableTypeChecker('Array')]), | ||
| observableMap: React.PropTypes.oneOfType([observableTypeChecker('Map')]), | ||
| observableObject: React.PropTypes.oneOfType([observableTypeChecker('Object')]), | ||
| arrayOrObservableArray: React.PropTypes.oneOfType([ | ||
| React.PropTypes.array, | ||
| observableTypeChecker('Array') | ||
| ]), | ||
| objectOrObservableObject: React.PropTypes.oneOfType([ | ||
| React.PropTypes.object, | ||
| observableTypeChecker('Object') | ||
| ]) | ||
| }; | ||
| /** | ||
| * Export | ||
| */ | ||
| return ({ | ||
| observer: observer, | ||
| Provider: Provider, | ||
| inject: inject, | ||
| propTypes: propTypes, | ||
| reactiveComponent: function() { | ||
| console.warn("[mobx-react] `reactiveComponent` has been renamed to `observer` and will be removed in 1.1."); | ||
| return observer.apply(null, arguments); | ||
| }, | ||
| renderReporter: renderReporter, | ||
| componentByNodeRegistery: componentByNodeRegistery, | ||
| trackComponents: trackComponents | ||
| }); | ||
| } | ||
| /** | ||
| * UMD | ||
| */ | ||
| if (typeof exports === 'object') { | ||
| module.exports = mrFactory(require('mobx'), require('react')); | ||
| } else if (typeof define === 'function' && define.amd) { | ||
| define('mobx-react', ['mobx', 'react'], mrFactory); | ||
| } else { | ||
| this.mobxReact = mrFactory(this['mobx'], this['React']); | ||
| } | ||
| })(); | ||
| !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("mobx"),require("react"),require("undefined")):"function"==typeof define&&define.amd?define(["mobx","react","undefined"],t):"object"==typeof exports?exports.mobxReact=t(require("mobx"),require("react"),require("undefined")):e.mobxReact=t(e.mobx,e.React,e.undefined)}(this,function(e,t,r){return function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={exports:{},id:n,loaded:!1};return e[n].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){"use strict";function n(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t["default"]=e,t}function o(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0}),t.reactiveComponent=t.propTypes=t.inject=t.Provider=t.trackComponents=t.componentByNodeRegistery=t.renderReporter=t.observer=void 0;var i=arguments,a=r(1);Object.defineProperty(t,"observer",{enumerable:!0,get:function(){return a.observer}}),Object.defineProperty(t,"renderReporter",{enumerable:!0,get:function(){return a.renderReporter}}),Object.defineProperty(t,"componentByNodeRegistery",{enumerable:!0,get:function(){return a.componentByNodeRegistery}}),Object.defineProperty(t,"trackComponents",{enumerable:!0,get:function(){return a.trackComponents}});var u=r(7);Object.defineProperty(t,"Provider",{enumerable:!0,get:function(){return o(u)["default"]}});var s=r(6);Object.defineProperty(t,"inject",{enumerable:!0,get:function(){return o(s)["default"]}});var c=r(2),f=o(c),l=r(3),p=o(l),d=r(8),b=n(d),y=void 0;if(y="mobx-react/native",!f["default"])throw new Error(y+" requires the MobX package");if(!p["default"])throw new Error(y+" requires React to be available");t.propTypes=b;t.reactiveComponent=function(){return console.warn("[mobx-react] `reactiveComponent` has been renamed to `observer` and will be removed in 1.1."),observer.apply(null,i)}},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e){return y["default"]?y["default"].findDOMNode(e):null}function i(e){var t=o(e);t&&j&&j.set(t,e),g.emit({event:"render",renderTime:e.__$mobRenderEnd-e.__$mobRenderStart,totalTime:Date.now()-e.__$mobRenderStart,component:e,node:t})}function a(){if("undefined"==typeof WeakMap)throw new Error("[mobx-react] tracking components is not supported in this browser.");x||(x=!0)}function u(e,t){var r=e[t],n=w[t];r?e[t]=function(){r.apply(this,arguments),n.apply(this,arguments)}:e[t]=n}function s(e,t){if("string"==typeof e)throw new Error("Store names should be provided as array");if(Array.isArray(e))return t?O["default"].apply(null,e)(s(t)):function(t){return s(e,t)};var r=e;if(!("function"!=typeof r||r.prototype&&r.prototype.render||r.isReactClass||d["default"].Component.isPrototypeOf(r)))return s(d["default"].createClass({displayName:r.displayName||r.name,propTypes:r.propTypes,contextTypes:r.contextTypes,getDefaultProps:function(){return r.defaultProps},render:function(){return r.call(this,this.props,this.context)}}));if(!r)throw new Error("Please pass a valid component to 'observer'");var n=r.prototype||r;return["componentWillMount","componentWillUnmount","componentDidMount","componentDidUpdate"].forEach(function(e){u(n,e)}),n.shouldComponentUpdate||(n.shouldComponentUpdate=w.shouldComponentUpdate),r.isMobXReactObserver=!0,r}Object.defineProperty(t,"__esModule",{value:!0}),t.renderReporter=t.componentByNodeRegistery=void 0;var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e};t.trackComponents=a,t.observer=s;var f=r(2),l=n(f),p=r(3),d=n(p),b=r(4),y=n(b),v=r(5),m=n(v),h=r(6),O=n(h),x=!1,j=t.componentByNodeRegistery="undefined"!=typeof WeakMap?new WeakMap:void 0,g=t.renderReporter=new m["default"],w={componentWillMount:function(){var e=this,t=this.displayName||this.name||this.constructor&&(this.constructor.displayName||this.constructor.name)||"<component>",r=this._reactInternalInstance&&this._reactInternalInstance._rootNodeID,n=this.render.bind(this),o=null,i=!1,a=function(){return o=new l["default"].Reaction(t+"#"+r+".render()",function(){i||(i=!0,"function"==typeof e.componentWillReact&&e.componentWillReact(),e.__$mobxIsUnmounted!==!0&&d["default"].Component.prototype.forceUpdate.call(e))}),u.$mobx=o,e.render=u,u()},u=function(){i=!1;var t=void 0;return o.track(function(){x&&(e.__$mobRenderStart=Date.now()),t=l["default"].extras.allowStateChanges(!1,n),x&&(e.__$mobRenderEnd=Date.now())}),t};this.render=a},componentWillUnmount:function(){if(this.render.$mobx&&this.render.$mobx.dispose(),this.__$mobxIsUnmounted=!0,x){var e=o(this);e&&j&&j["delete"](e),g.emit({event:"destroy",component:this,node:e})}},componentDidMount:function(){x&&i(this)},componentDidUpdate:function(){x&&i(this)},shouldComponentUpdate:function(e,t){if(this.render.$mobx&&this.render.$mobx.isScheduled()===!0)return!1;if(this.state!==t)return!0;var r=Object.keys(this.props);if(r.length!==Object.keys(e).length)return!0;for(var n=void 0,o=r.length-1;n=r[o];o--){var i=e[n];if(i!==this.props[n])return!0;if(i&&"object"===("undefined"==typeof i?"undefined":c(i))&&!l["default"].isObservable(i))return!0}return!1}}},function(t,r){t.exports=e},function(e,r){e.exports=t},function(e,t){e.exports=void 0},function(e,t){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var n=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}}(),o=function(){function e(){r(this,e),this.listeners=[]}return n(e,[{key:"on",value:function(e){var t=this;return this.listeners.push(e),function(){var r=t.listeners.indexOf(e);r!==-1&&t.listeners.splice(r,1)}}},{key:"emit",value:function(e){this.listeners.forEach(function(t){return t(e)})}}]),e}();t["default"]=o},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){var r=s["default"].createClass({displayName:"MobXStoreInjector",render:function(){var r={};for(var n in this.props)this.props.hasOwnProperty(n)&&(r[n]=this.props[n]);return r=e(this.context.mobxStores||{},r,this.context),s["default"].createElement(t,r)}});return r.contextTypes={mobxStores:u.PropTypes.object},r.wrappedComponent=t,r}function i(e){return function(t,r){return e.forEach(function(e){if(!(e in r)){if(!(e in t))throw new Error("MobX observer: Store '"+e+"' is not available! Make sure it is provided by some Provider");r[e]=t[e]}}),r}}function a(){var e=void 0;if("function"==typeof arguments[0])e=arguments[0];else{for(var t=[],r=0;r<arguments.length;r++)t[r]=arguments[r];e=i(t)}return function(t){return o(e,t)}}Object.defineProperty(t,"__esModule",{value:!0}),t["default"]=a;var u=r(3),s=n(u)},function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(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});var u=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}}(),s=r(3),c=n(s),f={children:!0,key:!0,ref:!0},l=function(e){function t(){return o(this,t),i(this,Object.getPrototypeOf(t).apply(this,arguments))}return a(t,e),u(t,[{key:"render",value:function(){return c["default"].Children.only(this.props.children)}},{key:"getChildContext",value:function(){var e={},t=this.context.mobxStores;if(t)for(var r in t)e[r]=t[r];for(var n in this.props)f[n]||(e[n]=this.props[n]);return{mobxStores:e}}},{key:"componentWillReceiveProps",value:function(e){Object.keys(e).length!==Object.keys(this.props).length&&console.warn("MobX Provider: The set of provided stores has changed. Please avoid changing stores as the change might not propagate to all children");for(var t in e)f[t]||this.props[t]===e[t]||console.warn("MobX Provider: Provided store '"+t+"' has changed. Please avoid replacing stores as the change might not propagate to all children")}}]),t}(s.Component);l.contextTypes={mobxStores:s.PropTypes.object},l.childContextTypes={mobxStores:s.PropTypes.object.isRequired},t["default"]=l},function(e,t,r){"use strict";function n(e){function t(t,r,n,o,i,a){if(o=o||ANONYMOUS,a=a||n,null==r[n]){if(t){var u=null===r[n]?"null":"undefined";return new Error("The "+i+" `"+a+"` is marked as required in `"+o+"`, but its value is `"+u+"`.")}return null}return e(r,n,o,i,a)}var r=t.bind(null,!1);return r.isRequired=t.bind(null,!0),r}function o(e,t){return"symbol"===e||("Symbol"===t["@@toStringTag"]||"function"==typeof Symbol&&t instanceof Symbol)}function i(e){var t="undefined"==typeof e?"undefined":c(e);return Array.isArray(e)?"array":e instanceof RegExp?"object":o(t,e)?"symbol":t}function a(e){var t=i(e);if("object"===t){if(e instanceof Date)return"date";if(e instanceof RegExp)return"regexp"}return t}function u(e,t){return n(function(r,n,o,u,s){if(e&&i(r[n])===t.toLowerCase())return null;var c=void 0;switch(t){case"Array":c=f.isObservableArray;break;case"Object":c=f.isObservableObject;break;case"Map":c=f.isObservableMap;break;default:throw new Error("Unexpected mobxType: "+t)}var l=r[n];if(!c(l)){var p=a(l),d=e?" or javascript `"+t.toLowerCase()+"`":"";return new Error("Invalid prop `"+s+"` of type `"+p+"` supplied to `"+o+"`, expected `mobx.Observable"+t+"`"+d+".")}return null})}function s(e,t){return n(function(r,n,o,i,a){if("function"!=typeof t)return new Error("Property `"+a+"` of component `"+o+"` has invalid PropType notation.");var s=u(e,"Array")(r,n,o);if(s instanceof Error)return s;for(var c=r[n],f=0;f<c.length;f++)if(s=t(c,f,o,i,a+"["+f+"]"),s instanceof Error)return s;return null})}Object.defineProperty(t,"__esModule",{value:!0}),t.objectOrObservableObject=t.arrayOrObservableArrayOf=t.arrayOrObservableArray=t.observableObject=t.observableMap=t.observableArrayOf=t.observableArray=void 0;var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},f=r(2);t.observableArray=u(!1,"Array"),t.observableArrayOf=s.bind(null,!1),t.observableMap=u(!1,"Map"),t.observableObject=u(!1,"Object"),t.arrayOrObservableArray=u(!0,"Array"),t.arrayOrObservableArrayOf=s.bind(null,!0),t.objectOrObservableObject=u(!0,"Object")}])}); |
| { | ||
| "name": "mobx-react", | ||
| "version": "3.5.1", | ||
| "version": "3.5.2-alpha.1", | ||
| "description": "React bindings for MobX. Create fully reactive components.", | ||
@@ -12,5 +12,5 @@ "main": "index.js", | ||
| "scripts": { | ||
| "build": "cp index.js native.js && git apply mobx-react-native.patch && cp index.js custom.js && git apply mobx-react-custom.patch && cp index.d.ts native.d.ts && cp index.d.ts custom.d.ts", | ||
| "build": "webpack && cp src/index.d.ts index.d.ts && cp src/index.d.ts native.d.ts && cp src/index.d.ts custom.d.ts", | ||
| "prepublish": "npm run build", | ||
| "test": "browserify -x react/addons -x react/lib/ReactContext -x react/lib/ExecutionEnvironment test/*.js | tape-run && tsc -p test/ts", | ||
| "test": "npm run build && browserify -x react/addons -x react/lib/ReactContext -x react/lib/ExecutionEnvironment test/*.js | tape-run && tsc -p test/ts", | ||
| "debug": "browserify -x react/addons -x react/lib/ReactContext -x react/lib/ExecutionEnvironment test/*.js | tape-run --browser chrome" | ||
@@ -28,3 +28,7 @@ }, | ||
| "devDependencies": { | ||
| "browserify": "^12.0.1", | ||
| "babel-core": "^6.11.4", | ||
| "babel-loader": "^6.2.4", | ||
| "babel-plugin-transform-class-properties": "^6.11.5", | ||
| "babel-preset-es2015": "^6.9.0", | ||
| "browserify": "^13.1.0", | ||
| "enzyme": "^2.3.0", | ||
@@ -39,3 +43,4 @@ "jquery": "^2.1.4", | ||
| "tape-run": "2.1.0", | ||
| "typescript": "^1.8.10" | ||
| "typescript": "^1.8.10", | ||
| "webpack": "^1.13.1" | ||
| }, | ||
@@ -51,2 +56,2 @@ "dependencies": {}, | ||
| ] | ||
| } | ||
| } |
@@ -102,5 +102,7 @@ # mobx-react | ||
| * `observableArray` | ||
| * `observableArrayOf(React.PropTypes.number)` | ||
| * `observableMap` | ||
| * `observableObject` | ||
| * `arrayOrObservableArray` | ||
| * `arrayOrObservableArrayOf(React.PropTypes.number)` | ||
| * `objectOrObservableObject` | ||
@@ -157,5 +159,5 @@ | ||
| Notes: | ||
| * If a component ask a store and receives a store via a property with the same name, the property takes precedence. Use this to your advantage when testing! | ||
| * If a component asks for a store and receives a store via a property with the same name, the property takes precedence. Use this to your advantage when testing! | ||
| * Values provided through `Provider` should be final, to avoid issues like mentioned in [React #2517](https://github.com/facebook/react/issues/2517) and [React #3973](https://github.com/facebook/react/pull/3973), where optimizations might stop the propagation of new context. Instead, make sure that if you put things in `context` that might change over time, that they are `@observable` or provide some other means to listen to changes, like callbacks. | ||
| * When using both `@inject` and `@observer`, make sure to apply them in the correct order: `observer` should be the inner decorator, `inject` the outher. There might be additional decorators in between. | ||
| * When using both `@inject` and `@observer`, make sure to apply them in the correct order: `observer` should be the inner decorator, `inject` the outer. There might be additional decorators in between. | ||
| * The original component wrapped by `inject` is available as the `wrappedComponent` property of created the higher order component. | ||
@@ -249,4 +251,4 @@ | ||
| WeakMap. It's `get` function returns the associated reactive component of the given node. The node needs to be precisely the root node of the component. | ||
| WeakMap. Its `get` function returns the associated reactive component of the given node. The node needs to be precisely the root node of the component. | ||
| This map is only available after invoking `trackComponents`. | ||
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by84.95%
137795
- Number of package files
- increased by100%
24
- Number of lines in readme file
- increased by0.8%
252
Worsened metrics
- Dev dependency count
- increased by45.45%
16
- Lines of code
- decreased by-88.83%
138
- Number of low quality alerts
- increased byInfinity%
4
- Number of medium supply chain risk alerts
- increased byInfinity%
2
No dependency changes