mobx-react 9.2.2 → 10.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/CHANGELOG.md +82 -0
  2. package/README.md +8 -264
  3. package/dist/index.d.ts +1 -6
  4. package/dist/mobxreact.cjs.development.js +101 -449
  5. package/dist/mobxreact.cjs.development.js.map +1 -1
  6. package/dist/mobxreact.cjs.production.min.js +1 -1
  7. package/dist/mobxreact.cjs.production.min.js.map +1 -1
  8. package/dist/mobxreact.esm.development.js +76 -405
  9. package/dist/mobxreact.esm.development.js.map +1 -1
  10. package/dist/mobxreact.esm.js +80 -407
  11. package/dist/mobxreact.esm.js.map +1 -1
  12. package/dist/mobxreact.esm.production.min.js +1 -1
  13. package/dist/mobxreact.esm.production.min.js.map +1 -1
  14. package/dist/mobxreact.mjs +340 -0
  15. package/dist/mobxreact.mjs.map +1 -0
  16. package/dist/mobxreact.umd.development.js +103 -450
  17. package/dist/mobxreact.umd.development.js.map +1 -1
  18. package/dist/mobxreact.umd.production.min.js +1 -1
  19. package/dist/mobxreact.umd.production.min.js.map +1 -1
  20. package/dist/utils/utils.d.ts +0 -8
  21. package/package.json +30 -20
  22. package/src/index.ts +3 -12
  23. package/src/observer.tsx +9 -8
  24. package/src/utils/utils.ts +0 -46
  25. package/batchingForReactDom.js +0 -1
  26. package/batchingForReactNative.js +0 -1
  27. package/batchingOptOut.js +0 -1
  28. package/dist/Provider.d.ts +0 -10
  29. package/dist/disposeOnUnmount.d.ts +0 -11
  30. package/dist/inject.d.ts +0 -6
  31. package/dist/propTypes.d.ts +0 -9
  32. package/dist/types/IStoresToProps.d.ts +0 -2
  33. package/dist/types/IValueMap.d.ts +0 -1
  34. package/dist/types/IWrappedComponent.d.ts +0 -4
  35. package/src/Provider.tsx +0 -29
  36. package/src/disposeOnUnmount.ts +0 -111
  37. package/src/inject.ts +0 -107
  38. package/src/propTypes.ts +0 -210
  39. package/src/types/IStoresToProps.ts +0 -7
  40. package/src/types/IValueMap.ts +0 -1
  41. package/src/types/IWrappedComponent.ts +0 -4
@@ -1,7 +1,10 @@
1
- import { _getGlobalState, Reaction, _allowStateChanges, untracked, isObservableMap, isObservableObject, isObservableArray, observable } from 'mobx';
2
- import React__default, { PureComponent, Component } from 'react';
1
+ const __MOBX_DEV__ = process.env.NODE_ENV !== "production";
2
+
3
+ import { _allowStateChanges, Reaction, _getGlobalState, observable } from 'mobx';
4
+ import * as React from 'react';
5
+ import { PureComponent, Component } from 'react';
3
6
  import { isUsingStaticRendering, _observerFinalizationRegistry, observer as observer$1 } from 'mobx-react-lite';
4
- export { Observer, enableStaticRendering, isUsingStaticRendering, observerBatching, useAsObservableSource, useLocalObservable, useLocalStore, useObserver, useStaticRendering } from 'mobx-react-lite';
7
+ export { Observer, _observerFinalizationRegistry, clearTimers, enableStaticRendering, isUsingStaticRendering, useLocalObservable } from 'mobx-react-lite';
5
8
 
6
9
  function shallowEqual(objA, objB) {
7
10
  //From: https://github.com/facebook/fbjs/blob/c69904a511b900266935168223063dd8772dfc40/packages/fbjs/src/core/shallowEqual.js
@@ -11,12 +14,12 @@ function shallowEqual(objA, objB) {
11
14
  if (typeof objA !== "object" || objA === null || typeof objB !== "object" || objB === null) {
12
15
  return false;
13
16
  }
14
- var keysA = Object.keys(objA);
15
- var keysB = Object.keys(objB);
17
+ const keysA = Object.keys(objA);
18
+ const keysB = Object.keys(objB);
16
19
  if (keysA.length !== keysB.length) {
17
20
  return false;
18
21
  }
19
- for (var i = 0; i < keysA.length; i++) {
22
+ for (let i = 0; i < keysA.length; i++) {
20
23
  if (!Object.hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {
21
24
  return false;
22
25
  }
@@ -31,53 +34,24 @@ function is(x, y) {
31
34
  return x !== x && y !== y;
32
35
  }
33
36
  }
34
- // based on https://github.com/mridgway/hoist-non-react-statics/blob/master/src/index.js
35
- var hoistBlackList = {
36
- $$typeof: 1,
37
- render: 1,
38
- compare: 1,
39
- type: 1,
40
- childContextTypes: 1,
41
- contextType: 1,
42
- contextTypes: 1,
43
- defaultProps: 1,
44
- getDefaultProps: 1,
45
- getDerivedStateFromError: 1,
46
- getDerivedStateFromProps: 1,
47
- mixins: 1,
48
- displayName: 1,
49
- propTypes: 1
50
- };
51
- function copyStaticProperties(base, target) {
52
- var protoProps = Object.getOwnPropertyNames(Object.getPrototypeOf(base));
53
- Object.getOwnPropertyNames(base).forEach(function (key) {
54
- if (!hoistBlackList[key] && protoProps.indexOf(key) === -1) {
55
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(base, key));
56
- }
57
- });
58
- }
59
37
  /**
60
38
  * Utilities for patching componentWillUnmount, to make sure @disposeOnUnmount works correctly icm with user defined hooks
61
39
  * and the handler provided by mobx-react
62
40
  */
63
- var mobxMixins = /*#__PURE__*/Symbol("patchMixins");
64
- var mobxPatchedDefinition = /*#__PURE__*/Symbol("patchedDefinition");
41
+ const mobxMixins = /*#__PURE__*/Symbol("patchMixins");
42
+ const mobxPatchedDefinition = /*#__PURE__*/Symbol("patchedDefinition");
65
43
  function getMixins(target, methodName) {
66
- var mixins = target[mobxMixins] = target[mobxMixins] || {};
67
- var methodMixins = mixins[methodName] = mixins[methodName] || {};
44
+ const mixins = target[mobxMixins] = target[mobxMixins] || {};
45
+ const methodMixins = mixins[methodName] = mixins[methodName] || {};
68
46
  methodMixins.locks = methodMixins.locks || 0;
69
47
  methodMixins.methods = methodMixins.methods || [];
70
48
  return methodMixins;
71
49
  }
72
- function wrapper(realMethod, mixins) {
73
- var _this = this;
74
- for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
75
- args[_key - 2] = arguments[_key];
76
- }
50
+ function wrapper(realMethod, mixins, ...args) {
77
51
  // locks are used to ensure that mixins are invoked only once per invocation, even on recursive calls
78
52
  mixins.locks++;
79
53
  try {
80
- var retVal;
54
+ let retVal;
81
55
  if (realMethod !== undefined && realMethod !== null) {
82
56
  retVal = realMethod.apply(this, args);
83
57
  }
@@ -85,58 +59,61 @@ function wrapper(realMethod, mixins) {
85
59
  } finally {
86
60
  mixins.locks--;
87
61
  if (mixins.locks === 0) {
88
- mixins.methods.forEach(function (mx) {
89
- mx.apply(_this, args);
62
+ mixins.methods.forEach(mx => {
63
+ mx.apply(this, args);
90
64
  });
91
65
  }
92
66
  }
93
67
  }
94
68
  function wrapFunction(realMethod, mixins) {
95
- var fn = function fn() {
96
- for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
97
- args[_key2] = arguments[_key2];
98
- }
99
- wrapper.call.apply(wrapper, [this, realMethod, mixins].concat(args));
69
+ const fn = function fn(...args) {
70
+ wrapper.call(this, realMethod, mixins, ...args);
100
71
  };
101
72
  return fn;
102
73
  }
103
74
  function patch(target, methodName, mixinMethod) {
104
- var mixins = getMixins(target, methodName);
75
+ const mixins = getMixins(target, methodName);
105
76
  if (mixins.methods.indexOf(mixinMethod) < 0) {
106
77
  mixins.methods.push(mixinMethod);
107
78
  }
108
- var oldDefinition = Object.getOwnPropertyDescriptor(target, methodName);
79
+ const oldDefinition = Object.getOwnPropertyDescriptor(target, methodName);
109
80
  if (oldDefinition && oldDefinition[mobxPatchedDefinition]) {
110
81
  // already patched definition, do not repatch
111
82
  return;
112
83
  }
113
- var originalMethod = target[methodName];
114
- var newDefinition = createDefinition(target, methodName, oldDefinition ? oldDefinition.enumerable : undefined, mixins, originalMethod);
84
+ const originalMethod = target[methodName];
85
+ const newDefinition = createDefinition(target, methodName, oldDefinition ? oldDefinition.enumerable : undefined, mixins, originalMethod);
115
86
  Object.defineProperty(target, methodName, newDefinition);
116
87
  }
117
88
  function createDefinition(target, methodName, enumerable, mixins, originalMethod) {
118
- var _ref;
119
- var wrappedFunc = wrapFunction(originalMethod, mixins);
120
- return _ref = {}, _ref[mobxPatchedDefinition] = true, _ref.get = function get() {
121
- return wrappedFunc;
122
- }, _ref.set = function set(value) {
123
- if (this === target) {
124
- wrappedFunc = wrapFunction(value, mixins);
125
- } else {
126
- // when it is an instance of the prototype/a child prototype patch that particular case again separately
127
- // since we need to store separate values depending on wether it is the actual instance, the prototype, etc
128
- // e.g. the method for super might not be the same as the method for the prototype which might be not the same
129
- // as the method for the instance
130
- var newDefinition = createDefinition(this, methodName, enumerable, mixins, value);
131
- Object.defineProperty(this, methodName, newDefinition);
132
- }
133
- }, _ref.configurable = true, _ref.enumerable = enumerable, _ref;
89
+ let wrappedFunc = wrapFunction(originalMethod, mixins);
90
+ return {
91
+ // @ts-ignore
92
+ [mobxPatchedDefinition]: true,
93
+ get: function () {
94
+ return wrappedFunc;
95
+ },
96
+ set: function (value) {
97
+ if (this === target) {
98
+ wrappedFunc = wrapFunction(value, mixins);
99
+ } else {
100
+ // when it is an instance of the prototype/a child prototype patch that particular case again separately
101
+ // since we need to store separate values depending on wether it is the actual instance, the prototype, etc
102
+ // e.g. the method for super might not be the same as the method for the prototype which might be not the same
103
+ // as the method for the instance
104
+ const newDefinition = createDefinition(this, methodName, enumerable, mixins, value);
105
+ Object.defineProperty(this, methodName, newDefinition);
106
+ }
107
+ },
108
+ configurable: true,
109
+ enumerable: enumerable
110
+ };
134
111
  }
135
112
 
136
- var administrationSymbol = /*#__PURE__*/Symbol("ObserverAdministration");
137
- var isMobXReactObserverSymbol = /*#__PURE__*/Symbol("isMobXReactObserver");
138
- var observablePropDescriptors;
139
- if (process.env.NODE_ENV !== "production") {
113
+ const administrationSymbol = /*#__PURE__*/Symbol("ObserverAdministration");
114
+ const isMobXReactObserverSymbol = /*#__PURE__*/Symbol("isMobXReactObserver");
115
+ let observablePropDescriptors;
116
+ if (__MOBX_DEV__) {
140
117
  observablePropDescriptors = {
141
118
  props: /*#__PURE__*/createObservablePropDescriptor("props"),
142
119
  state: /*#__PURE__*/createObservablePropDescriptor("state"),
@@ -160,10 +137,12 @@ function getAdministration(component) {
160
137
  };
161
138
  }
162
139
  function makeClassComponentObserver(componentClass) {
163
- var prototype = componentClass.prototype;
140
+ const {
141
+ prototype
142
+ } = componentClass;
164
143
  if (componentClass[isMobXReactObserverSymbol]) {
165
- var displayName = getDisplayName(componentClass);
166
- throw new Error("The provided component class (" + displayName + ") has already been declared as an observer component.");
144
+ const displayName = getDisplayName(componentClass);
145
+ throw new Error(`The provided component class (${displayName}) has already been declared as an observer component.`);
167
146
  } else {
168
147
  componentClass[isMobXReactObserverSymbol] = true;
169
148
  }
@@ -178,13 +157,13 @@ function makeClassComponentObserver(componentClass) {
178
157
  throw new Error("It is not allowed to use shouldComponentUpdate in observer based components.");
179
158
  }
180
159
  }
181
- if (process.env.NODE_ENV !== "production") {
160
+ if (__MOBX_DEV__) {
182
161
  Object.defineProperties(prototype, observablePropDescriptors);
183
162
  }
184
- var originalRender = prototype.render;
163
+ const originalRender = prototype.render;
185
164
  if (typeof originalRender !== "function") {
186
- var _displayName = getDisplayName(componentClass);
187
- throw new Error("[mobx-react] class component (" + _displayName + ") is missing `render` method." + "\n`observer` requires `render` being a function defined on prototype." + "\n`render = () => {}` or `render = function() {}` is not supported.");
165
+ const displayName = getDisplayName(componentClass);
166
+ throw new Error(`[mobx-react] class component (${displayName}) is missing \`render\` method.` + `\n\`observer\` requires \`render\` being a function defined on prototype.` + `\n\`render = () => {}\` or \`render = function() {}\` is not supported.`);
188
167
  }
189
168
  prototype.render = function () {
190
169
  Object.defineProperty(this, "render", {
@@ -195,12 +174,11 @@ function makeClassComponentObserver(componentClass) {
195
174
  });
196
175
  return this.render();
197
176
  };
198
- var originalComponentDidMount = prototype.componentDidMount;
177
+ const originalComponentDidMount = prototype.componentDidMount;
199
178
  prototype.componentDidMount = function () {
200
- var _this = this;
201
- if (process.env.NODE_ENV !== "production" && this.componentDidMount !== Object.getPrototypeOf(this).componentDidMount) {
202
- var _displayName2 = getDisplayName(componentClass);
203
- throw new Error("[mobx-react] `observer(" + _displayName2 + ").componentDidMount` must be defined on prototype." + "\n`componentDidMount = () => {}` or `componentDidMount = function() {}` is not supported.");
179
+ if (__MOBX_DEV__ && this.componentDidMount !== Object.getPrototypeOf(this).componentDidMount) {
180
+ const displayName = getDisplayName(componentClass);
181
+ throw new Error(`[mobx-react] \`observer(${displayName}).componentDidMount\` must be defined on prototype.` + `\n\`componentDidMount = () => {}\` or \`componentDidMount = function() {}\` is not supported.`);
204
182
  }
205
183
  // `componentDidMount` may not be called at all. React can abandon the instance after `render`.
206
184
  // That's why we use finalization registry to dispose reaction created during render.
@@ -213,7 +191,7 @@ function makeClassComponentObserver(componentClass) {
213
191
  // Therefore we don't have to worry about external (observable) state being updated before mount (no state version checking).
214
192
  //
215
193
  // Things may change: "In the future, React will provide a feature that lets components preserve state between unmounts"
216
- var admin = getAdministration(this);
194
+ const admin = getAdministration(this);
217
195
  admin.mounted = true;
218
196
  // Component instance committed, prevent reaction disposal.
219
197
  _observerFinalizationRegistry.unregister(this);
@@ -221,9 +199,7 @@ function makeClassComponentObserver(componentClass) {
221
199
  // therefore `this` could NOT be garbage collected before mount,
222
200
  // preventing reaction disposal by FinalizationRegistry and leading to memory leak.
223
201
  // As an alternative we could have `admin.instanceRef = new WeakRef(this)`, but lets avoid it if possible.
224
- admin.forceUpdate = function () {
225
- return _this.forceUpdate();
226
- };
202
+ admin.forceUpdate = () => this.forceUpdate();
227
203
  if (!admin.reaction || admin.reactionInvalidatedBeforeMount) {
228
204
  // Missing reaction:
229
205
  // 1. Instance was unmounted (reaction disposed) and immediately remounted without running render #3395.
@@ -243,7 +219,7 @@ function makeClassComponentObserver(componentClass) {
243
219
  if (isUsingStaticRendering()) {
244
220
  return;
245
221
  }
246
- var admin = getAdministration(this);
222
+ const admin = getAdministration(this);
247
223
  (_admin$reaction = admin.reaction) == null || _admin$reaction.dispose();
248
224
  admin.reaction = null;
249
225
  admin.forceUpdate = null;
@@ -257,8 +233,8 @@ function getDisplayName(componentClass) {
257
233
  return componentClass.displayName || componentClass.name || "<component>";
258
234
  }
259
235
  function createReactiveRender(originalRender) {
260
- var boundOriginalRender = originalRender.bind(this);
261
- var admin = getAdministration(this);
236
+ const boundOriginalRender = originalRender.bind(this);
237
+ const admin = getAdministration(this);
262
238
  function reactiveRender() {
263
239
  if (!admin.reaction) {
264
240
  // Create reaction lazily to support re-mounting #3395
@@ -269,9 +245,9 @@ function createReactiveRender(originalRender) {
269
245
  _observerFinalizationRegistry.register(this, admin, this);
270
246
  }
271
247
  }
272
- var error = undefined;
273
- var renderResult = undefined;
274
- admin.reaction.track(function () {
248
+ let error = undefined;
249
+ let renderResult = undefined;
250
+ admin.reaction.track(() => {
275
251
  try {
276
252
  // TODO@major
277
253
  // Optimization: replace with _allowStateChangesStart/End (not available in mobx@6.0.0)
@@ -288,7 +264,7 @@ function createReactiveRender(originalRender) {
288
264
  return reactiveRender;
289
265
  }
290
266
  function createReaction(admin) {
291
- return new Reaction(admin.name + ".render()", function () {
267
+ return new Reaction(`${admin.name}.render()`, () => {
292
268
  if (!admin.mounted) {
293
269
  // This is neccessary to avoid react warning about calling forceUpdate on component that isn't mounted yet.
294
270
  // This happens when component is abandoned after render - our reaction is already created and reacts to changes.
@@ -324,15 +300,17 @@ function createObservablePropDescriptor(key) {
324
300
  return {
325
301
  configurable: true,
326
302
  enumerable: true,
327
- get: function get() {
328
- var admin = getAdministration(this);
329
- var derivation = _getGlobalState().trackingDerivation;
303
+ get() {
304
+ const admin = getAdministration(this);
305
+ const derivation = _getGlobalState().trackingDerivation;
330
306
  if (derivation && derivation !== admin.reaction) {
331
- throw new Error("[mobx-react] Cannot read \"" + admin.name + "." + key + "\" in a reactive context, as it isn't observable.\n Please use component lifecycle method to copy the value into a local observable first.\n See https://github.com/mobxjs/mobx/blob/main/packages/mobx-react/README.md#note-on-using-props-and-state-in-derivations");
307
+ throw new Error(`[mobx-react] Cannot read "${admin.name}.${key}" in a reactive context, as it isn't observable.
308
+ Please use component lifecycle method to copy the value into a local observable first.
309
+ See https://github.com/mobxjs/mobx/blob/main/packages/mobx-react/README.md#note-on-using-props-and-state-in-derivations`);
332
310
  }
333
311
  return admin[key];
334
312
  },
335
- set: function set(value) {
313
+ set(value) {
336
314
  getAdministration(this)[key] = value;
337
315
  }
338
316
  };
@@ -342,10 +320,7 @@ function observer(component, context) {
342
320
  if (context && context.kind !== "class") {
343
321
  throw new Error("The @observer decorator can be used on classes only");
344
322
  }
345
- if (component["isMobxInjector"] === true) {
346
- console.warn("Mobx observer: You are trying to use `observer` on a component that already has `inject`. Please apply `observer` before applying `inject`");
347
- }
348
- if (Object.prototype.isPrototypeOf.call(Component, component) || Object.prototype.isPrototypeOf.call(PureComponent, component)) {
323
+ if (Object.prototype.isPrototypeOf.call(React.Component, component) || Object.prototype.isPrototypeOf.call(React.PureComponent, component)) {
349
324
  // Class component
350
325
  return makeClassComponentObserver(component);
351
326
  } else {
@@ -354,308 +329,6 @@ function observer(component, context) {
354
329
  }
355
330
  }
356
331
 
357
- function _extends() {
358
- return _extends = Object.assign ? Object.assign.bind() : function (n) {
359
- for (var e = 1; e < arguments.length; e++) {
360
- var t = arguments[e];
361
- for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
362
- }
363
- return n;
364
- }, _extends.apply(null, arguments);
365
- }
366
- function _objectWithoutPropertiesLoose(r, e) {
367
- if (null == r) return {};
368
- var t = {};
369
- for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
370
- if (-1 !== e.indexOf(n)) continue;
371
- t[n] = r[n];
372
- }
373
- return t;
374
- }
375
-
376
- var _excluded = ["children"];
377
- var MobXProviderContext = /*#__PURE__*/React__default.createContext({});
378
- function Provider(props) {
379
- var children = props.children,
380
- stores = _objectWithoutPropertiesLoose(props, _excluded);
381
- var parentValue = React__default.useContext(MobXProviderContext);
382
- var mutableProviderRef = React__default.useRef(_extends({}, parentValue, stores));
383
- var value = mutableProviderRef.current;
384
- if (process.env.NODE_ENV !== "production") {
385
- var newValue = _extends({}, value, stores); // spread in previous state for the context based stores
386
- if (!shallowEqual(value, newValue)) {
387
- throw new Error("MobX Provider: The set of provided stores has changed. See: https://github.com/mobxjs/mobx-react#the-set-of-provided-stores-has-changed-error.");
388
- }
389
- }
390
- return React__default.createElement(MobXProviderContext.Provider, {
391
- value: value
392
- }, children);
393
- }
394
- Provider.displayName = "MobXProvider";
395
-
396
- /**
397
- * Store Injection
398
- */
399
- function createStoreInjector(grabStoresFn, component, injectNames, makeReactive) {
400
- // Support forward refs
401
- var Injector = React__default.forwardRef(function (props, ref) {
402
- var newProps = _extends({}, props);
403
- var context = React__default.useContext(MobXProviderContext);
404
- Object.assign(newProps, grabStoresFn(context || {}, newProps) || {});
405
- if (ref) {
406
- newProps.ref = ref;
407
- }
408
- return React__default.createElement(component, newProps);
409
- });
410
- if (makeReactive) Injector = observer(Injector);
411
- Injector["isMobxInjector"] = true; // assigned late to suppress observer warning
412
- // Static fields from component should be visible on the generated Injector
413
- copyStaticProperties(component, Injector);
414
- Injector["wrappedComponent"] = component;
415
- Injector.displayName = getInjectName(component, injectNames);
416
- return Injector;
417
- }
418
- function getInjectName(component, injectNames) {
419
- var displayName;
420
- var componentName = component.displayName || component.name || component.constructor && component.constructor.name || "Component";
421
- if (injectNames) displayName = "inject-with-" + injectNames + "(" + componentName + ")";else displayName = "inject(" + componentName + ")";
422
- return displayName;
423
- }
424
- function grabStoresByName(storeNames) {
425
- return function (baseStores, nextProps) {
426
- storeNames.forEach(function (storeName) {
427
- if (storeName in nextProps // prefer props over stores
428
- ) return;
429
- if (!(storeName in baseStores)) throw new Error("MobX injector: Store '" + storeName + "' is not available! Make sure it is provided by some Provider");
430
- nextProps[storeName] = baseStores[storeName];
431
- });
432
- return nextProps;
433
- };
434
- }
435
- /**
436
- * higher order component that injects stores to a child.
437
- * takes either a varargs list of strings, which are stores read from the context,
438
- * or a function that manually maps the available stores from the context to props:
439
- * storesToProps(mobxStores, props, context) => newProps
440
- */
441
- function inject() {
442
- for (var _len = arguments.length, storeNames = new Array(_len), _key = 0; _key < _len; _key++) {
443
- storeNames[_key] = arguments[_key];
444
- }
445
- if (typeof arguments[0] === "function") {
446
- var grabStoresFn = arguments[0];
447
- return function (componentClass) {
448
- return createStoreInjector(grabStoresFn, componentClass, grabStoresFn.name, true);
449
- };
450
- } else {
451
- return function (componentClass) {
452
- return createStoreInjector(grabStoresByName(storeNames), componentClass, storeNames.join("-"), false);
453
- };
454
- }
455
- }
456
-
457
- var reactMajorVersion = /*#__PURE__*/Number.parseInt(React__default.version, 10);
458
- var warnedAboutDisposeOnUnmountDeprecated = false;
459
- var protoStoreKey = /*#__PURE__*/Symbol("disposeOnUnmountProto");
460
- var instStoreKey = /*#__PURE__*/Symbol("disposeOnUnmountInst");
461
- function runDisposersOnWillUnmount() {
462
- var _this = this;
463
- [].concat(this[protoStoreKey] || [], this[instStoreKey] || []).forEach(function (propKeyOrFunction) {
464
- var prop = typeof propKeyOrFunction === "string" ? _this[propKeyOrFunction] : propKeyOrFunction;
465
- if (prop !== undefined && prop !== null) {
466
- if (Array.isArray(prop)) prop.map(function (f) {
467
- return f();
468
- });else prop();
469
- }
470
- });
471
- }
472
- /**
473
- * @deprecated `disposeOnUnmount` is not compatible with React 18 and higher.
474
- */
475
- function disposeOnUnmount(target, propertyKeyOrFunction) {
476
- if (Array.isArray(propertyKeyOrFunction)) {
477
- return propertyKeyOrFunction.map(function (fn) {
478
- return disposeOnUnmount(target, fn);
479
- });
480
- }
481
- if (!warnedAboutDisposeOnUnmountDeprecated) {
482
- if (reactMajorVersion >= 18) {
483
- console.error("[mobx-react] disposeOnUnmount is not compatible with React 18 and higher. Don't use it.");
484
- } else {
485
- console.warn("[mobx-react] disposeOnUnmount is deprecated. It won't work correctly with React 18 and higher.");
486
- }
487
- warnedAboutDisposeOnUnmountDeprecated = true;
488
- }
489
- var c = Object.getPrototypeOf(target).constructor;
490
- var c2 = Object.getPrototypeOf(target.constructor);
491
- // Special case for react-hot-loader
492
- var c3 = Object.getPrototypeOf(Object.getPrototypeOf(target));
493
- if (!(c === React__default.Component || c === React__default.PureComponent || c2 === React__default.Component || c2 === React__default.PureComponent || c3 === React__default.Component || c3 === React__default.PureComponent)) {
494
- throw new Error("[mobx-react] disposeOnUnmount only supports direct subclasses of React.Component or React.PureComponent.");
495
- }
496
- if (typeof propertyKeyOrFunction !== "string" && typeof propertyKeyOrFunction !== "function" && !Array.isArray(propertyKeyOrFunction)) {
497
- throw new Error("[mobx-react] disposeOnUnmount only works if the parameter is either a property key or a function.");
498
- }
499
- // decorator's target is the prototype, so it doesn't have any instance properties like props
500
- var isDecorator = typeof propertyKeyOrFunction === "string";
501
- // add property key / function we want run (disposed) to the store
502
- var componentWasAlreadyModified = !!target[protoStoreKey] || !!target[instStoreKey];
503
- var store = isDecorator ?
504
- // decorators are added to the prototype store
505
- target[protoStoreKey] || (target[protoStoreKey] = []) :
506
- // functions are added to the instance store
507
- target[instStoreKey] || (target[instStoreKey] = []);
508
- store.push(propertyKeyOrFunction);
509
- // tweak the component class componentWillUnmount if not done already
510
- if (!componentWasAlreadyModified) {
511
- patch(target, "componentWillUnmount", runDisposersOnWillUnmount);
512
- }
513
- // return the disposer as is if invoked as a non decorator
514
- if (typeof propertyKeyOrFunction !== "string") {
515
- return propertyKeyOrFunction;
516
- }
517
- }
518
-
519
- // Copied from React.PropTypes
520
- function createChainableTypeChecker(validator) {
521
- function checkType(isRequired, props, propName, componentName, location, propFullName) {
522
- for (var _len = arguments.length, rest = new Array(_len > 6 ? _len - 6 : 0), _key = 6; _key < _len; _key++) {
523
- rest[_key - 6] = arguments[_key];
524
- }
525
- return untracked(function () {
526
- componentName = componentName || "<<anonymous>>";
527
- propFullName = propFullName || propName;
528
- if (props[propName] == null) {
529
- if (isRequired) {
530
- var actual = props[propName] === null ? "null" : "undefined";
531
- return new Error("The " + location + " `" + propFullName + "` is marked as required " + "in `" + componentName + "`, but its value is `" + actual + "`.");
532
- }
533
- return null;
534
- } else {
535
- // @ts-ignore rest arg is necessary for some React internals - fails tests otherwise
536
- return validator.apply(void 0, [props, propName, componentName, location, propFullName].concat(rest));
537
- }
538
- });
539
- }
540
- var chainedCheckType = checkType.bind(null, false);
541
- // Add isRequired to satisfy Requirable
542
- chainedCheckType.isRequired = checkType.bind(null, true);
543
- return chainedCheckType;
544
- }
545
- // Copied from React.PropTypes
546
- function isSymbol(propType, propValue) {
547
- // Native Symbol.
548
- if (propType === "symbol") {
549
- return true;
550
- }
551
- // 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'
552
- if (propValue["@@toStringTag"] === "Symbol") {
553
- return true;
554
- }
555
- // Fallback for non-spec compliant Symbols which are polyfilled.
556
- if (typeof Symbol === "function" && propValue instanceof Symbol) {
557
- return true;
558
- }
559
- return false;
560
- }
561
- // Copied from React.PropTypes
562
- function getPropType(propValue) {
563
- var propType = typeof propValue;
564
- if (Array.isArray(propValue)) {
565
- return "array";
566
- }
567
- if (propValue instanceof RegExp) {
568
- // Old webkits (at least until Android 4.0) return 'function' rather than
569
- // 'object' for typeof a RegExp. We'll normalize this here so that /bla/
570
- // passes PropTypes.object.
571
- return "object";
572
- }
573
- if (isSymbol(propType, propValue)) {
574
- return "symbol";
575
- }
576
- return propType;
577
- }
578
- // This handles more types than `getPropType`. Only used for error messages.
579
- // Copied from React.PropTypes
580
- function getPreciseType(propValue) {
581
- var propType = getPropType(propValue);
582
- if (propType === "object") {
583
- if (propValue instanceof Date) {
584
- return "date";
585
- } else if (propValue instanceof RegExp) {
586
- return "regexp";
587
- }
588
- }
589
- return propType;
590
- }
591
- function createObservableTypeCheckerCreator(allowNativeType, mobxType) {
592
- return createChainableTypeChecker(function (props, propName, componentName, location, propFullName) {
593
- return untracked(function () {
594
- if (allowNativeType) {
595
- if (getPropType(props[propName]) === mobxType.toLowerCase()) return null;
596
- }
597
- var mobxChecker;
598
- switch (mobxType) {
599
- case "Array":
600
- mobxChecker = isObservableArray;
601
- break;
602
- case "Object":
603
- mobxChecker = isObservableObject;
604
- break;
605
- case "Map":
606
- mobxChecker = isObservableMap;
607
- break;
608
- default:
609
- throw new Error("Unexpected mobxType: " + mobxType);
610
- }
611
- var propValue = props[propName];
612
- if (!mobxChecker(propValue)) {
613
- var preciseType = getPreciseType(propValue);
614
- var nativeTypeExpectationMessage = allowNativeType ? " or javascript `" + mobxType.toLowerCase() + "`" : "";
615
- return new Error("Invalid prop `" + propFullName + "` of type `" + preciseType + "` supplied to" + " `" + componentName + "`, expected `mobx.Observable" + mobxType + "`" + nativeTypeExpectationMessage + ".");
616
- }
617
- return null;
618
- });
619
- });
620
- }
621
- function createObservableArrayOfTypeChecker(allowNativeType, typeChecker) {
622
- return createChainableTypeChecker(function (props, propName, componentName, location, propFullName) {
623
- for (var _len2 = arguments.length, rest = new Array(_len2 > 5 ? _len2 - 5 : 0), _key2 = 5; _key2 < _len2; _key2++) {
624
- rest[_key2 - 5] = arguments[_key2];
625
- }
626
- return untracked(function () {
627
- if (typeof typeChecker !== "function") {
628
- return new Error("Property `" + propFullName + "` of component `" + componentName + "` has " + "invalid PropType notation.");
629
- } else {
630
- var error = createObservableTypeCheckerCreator(allowNativeType, "Array")(props, propName, componentName, location, propFullName);
631
- if (error instanceof Error) return error;
632
- var propValue = props[propName];
633
- for (var i = 0; i < propValue.length; i++) {
634
- error = typeChecker.apply(void 0, [propValue, i, componentName, location, propFullName + "[" + i + "]"].concat(rest));
635
- if (error instanceof Error) return error;
636
- }
637
- return null;
638
- }
639
- });
640
- });
641
- }
642
- var observableArray = /*#__PURE__*/createObservableTypeCheckerCreator(false, "Array");
643
- var observableArrayOf = /*#__PURE__*/createObservableArrayOfTypeChecker.bind(null, false);
644
- var observableMap = /*#__PURE__*/createObservableTypeCheckerCreator(false, "Map");
645
- var observableObject = /*#__PURE__*/createObservableTypeCheckerCreator(false, "Object");
646
- var arrayOrObservableArray = /*#__PURE__*/createObservableTypeCheckerCreator(true, "Array");
647
- var arrayOrObservableArrayOf = /*#__PURE__*/createObservableArrayOfTypeChecker.bind(null, true);
648
- var objectOrObservableObject = /*#__PURE__*/createObservableTypeCheckerCreator(true, "Object");
649
- var PropTypes = {
650
- observableArray: observableArray,
651
- observableArrayOf: observableArrayOf,
652
- observableMap: observableMap,
653
- observableObject: observableObject,
654
- arrayOrObservableArray: arrayOrObservableArray,
655
- arrayOrObservableArrayOf: arrayOrObservableArrayOf,
656
- objectOrObservableObject: objectOrObservableObject
657
- };
658
-
659
332
  if (!Component) {
660
333
  throw new Error("mobx-react requires React to be available");
661
334
  }
@@ -663,5 +336,5 @@ if (!observable) {
663
336
  throw new Error("mobx-react requires mobx to be available");
664
337
  }
665
338
 
666
- export { MobXProviderContext, PropTypes, Provider, disposeOnUnmount, inject, observer };
339
+ export { observer };
667
340
  //# sourceMappingURL=mobxreact.esm.js.map