mobx-react-lite - npm Package Compare versions

Comparing version 4.0.7 to 4.1.0

CHANGELOG.md

 # mobx-react-lite
 
+## 4.1.0
+
+### Minor Changes
+
+-   [`2587df31a1a967a6b385b7ab2d9f0d42fc94e4b0`](https://github.com/mobxjs/mobx/commit/2587df31a1a967a6b385b7ab2d9f0d42fc94e4b0) [#3985](https://github.com/mobxjs/mobx/pull/3985) Thanks [@imjordanxd](https://github.com/imjordanxd)! - \* Added React 19 support, fixes #3986
+
 ## 4.0.7
@@ -4,0 +10,0 @@

dist/mobxreactlite.cjs.development.js

@@ -69,2 +69,3 @@ 'use strict';
     this.sweepTimeout = void 0;
+    // Bound so it can be used directly as setTimeout callback.
     this.sweep = function (maxAge) {
@@ -88,2 +89,3 @@ if (maxAge === void 0) {
     };
+    // Bound so it can be exported directly as clearTimers test utility.
     this.finalizeAllImmediately = function () {
@@ -105,5 +107,3 @@ _this.sweep(0);
     this.registrations["delete"](token);
-  }
-  // Bound so it can be used directly as setTimeout callback.
-  ;
+  };
   _proto.scheduleSweep = function scheduleSweep() {
@@ -120,3 +120,3 @@ if (this.sweepTimeout === undefined) {
   var _adm$reaction;
-  (_adm$reaction = adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+  (_adm$reaction = adm.reaction) == null || _adm$reaction.dispose();
   adm.reaction = null;
@@ -131,3 +131,3 @@ });
     // `useSyncExternalStore` should handle that by checking the state version and issuing update.
-    adm.onStoreChange == null ? void 0 : adm.onStoreChange();
+    adm.onStoreChange == null || adm.onStoreChange();
   });
@@ -169,3 +169,3 @@ }
           _adm.onStoreChange = null;
-          (_adm$reaction = _adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+          (_adm$reaction = _adm.reaction) == null || _adm$reaction.dispose();
           _adm.reaction = null;
@@ -209,3 +209,2 @@ };
   }
-
   return renderResult;
@@ -216,2 +215,3 @@ }
 var warnObserverOptionsDeprecated = true;
+var warnLegacyContextTypes = true;
 var hasSymbol = typeof Symbol === "function" && Symbol["for"];
@@ -270,2 +270,6 @@ var isFunctionNameConfigurable = (_Object$getOwnPropert = (_Object$getOwnPropert2 = /*#__PURE__*/Object.getOwnPropertyDescriptor(function () {}, "name")) == null ? void 0 : _Object$getOwnPropert2.configurable) != null ? _Object$getOwnPropert : false;
     observerComponent.contextTypes = baseComponent.contextTypes;
+    if ( warnLegacyContextTypes) {
+      warnLegacyContextTypes = false;
+      console.warn("[mobx-react-lite] Support for Legacy Context in function components will be removed in the next major release.");
+    }
   }
@@ -314,2 +318,5 @@ if (useForwardRef) {
     render = _ref.render;
+  if (children && render) {
+    console.error("MobX Observer: Do not use children and render in the same time in `Observer`");
+  }
   var component = children || render;
@@ -316,0 +323,0 @@ if (typeof component !== "function") {

dist/mobxreactlite.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("mobx"),r=require("react"),n=(e=r)&&"object"==typeof e&&"default"in e?e.default:e,o=require("react-dom"),i=require("use-sync-external-store/shim");if(!r.useState)throw new Error("mobx-react-lite requires React with Hooks support");if(!t.makeObservable)throw new Error("mobx-react-lite@3 requires mobx at least version 6 to be available");function a(e){e()}function s(e){e||(e=a),t.configure({reactionScheduler:e})}function u(e){return t.getDependencyTree(e)}var c=!1;function l(e){c=e}function f(){return c}var p,d,b=new("undefined"!=typeof FinalizationRegistry?FinalizationRegistry:function(){function e(e){var t=this;this.finalize=void 0,this.registrations=new Map,this.sweepTimeout=void 0,this.sweep=function(e){void 0===e&&(e=1e4),clearTimeout(t.sweepTimeout),t.sweepTimeout=void 0;var r=Date.now();t.registrations.forEach((function(n,o){r-n.registeredAt>=e&&(t.finalize(n.value),t.registrations.delete(o))})),t.registrations.size>0&&t.scheduleSweep()},this.finalizeAllImmediately=function(){t.sweep(0)},this.finalize=e}var t=e.prototype;return t.register=function(e,t,r){this.registrations.set(r,{value:t,registeredAt:Date.now()}),this.scheduleSweep()},t.unregister=function(e){this.registrations.delete(e)},t.scheduleSweep=function(){void 0===this.sweepTimeout&&(this.sweepTimeout=setTimeout(this.sweep,1e4))},e}())((function(e){var t;null==(t=e.reaction)||t.dispose(),e.reaction=null}));function v(e){e.reaction=new t.Reaction("observer"+e.name,(function(){e.stateVersion=Symbol(),null==e.onStoreChange||e.onStoreChange()}))}function m(e,t){if(void 0===t&&(t="observed"),f())return e();var r=n.useRef(null);if(!r.current){var o={reaction:null,onStoreChange:null,stateVersion:Symbol(),name:t,subscribe:function(e){return b.unregister(o),o.onStoreChange=e,o.reaction||(v(o),o.stateVersion=Symbol()),function(){var e;o.onStoreChange=null,null==(e=o.reaction)||e.dispose(),o.reaction=null}},getSnapshot:function(){return o.stateVersion}};r.current=o}var a,s,c=r.current;if(c.reaction||(v(c),b.register(r,c,c)),n.useDebugValue(c.reaction,u),i.useSyncExternalStore(c.subscribe,c.getSnapshot,c.getSnapshot),c.reaction.track((function(){try{a=e()}catch(e){s=e}})),s)throw s;return a}var y,h="function"==typeof Symbol&&Symbol.for,g=null!=(p=null==(d=Object.getOwnPropertyDescriptor((function(){}),"name"))?void 0:d.configurable)&&p,w=h?Symbol.for("react.forward_ref"):"function"==typeof r.forwardRef&&r.forwardRef((function(e){return null})).$$typeof,S=h?Symbol.for("react.memo"):"function"==typeof r.memo&&r.memo((function(e){return null})).$$typeof,x={$$typeof:!0,render:!0,compare:!0,type:!0,displayName:!0};function O(e){var t=e.children||e.render;return"function"!=typeof t?null:m(t)}function R(e){var n=r.useState((function(){return t.observable(e,{},{deep:!1})}))[0];return t.runInAction((function(){Object.assign(n,e)})),n}O.displayName="Observer",s(o.unstable_batchedUpdates);var T=null!=(y=b.finalizeAllImmediately)?y:function(){};exports.Observer=O,exports._observerFinalizationRegistry=b,exports.clearTimers=T,exports.enableStaticRendering=l,exports.isObserverBatched=function(){return!0},exports.isUsingStaticRendering=f,exports.observer=function(e,t){var n;if(S&&e.$$typeof===S)throw new Error("[mobx-react-lite] You are trying to use `observer` on a function component wrapped in either another `observer` or `React.memo`. The observer already applies 'React.memo' for you.");if(f())return e;var o=null!=(n=null==t?void 0:t.forwardRef)&&n,i=e,a=e.displayName||e.name;if(w&&e.$$typeof===w&&(o=!0,"function"!=typeof(i=e.render)))throw new Error("[mobx-react-lite] `render` property of ForwardRef was not a function");var s,u,c=function(e,t){return m((function(){return i(e,t)}),a)};return c.displayName=e.displayName,g&&Object.defineProperty(c,"name",{value:e.name,writable:!0,configurable:!0}),e.contextTypes&&(c.contextTypes=e.contextTypes),o&&(c=r.forwardRef(c)),c=r.memo(c),s=e,u=c,Object.keys(s).forEach((function(e){x[e]||Object.defineProperty(u,e,Object.getOwnPropertyDescriptor(s,e))})),c},exports.observerBatching=s,exports.useAsObservableSource=R,exports.useLocalObservable=function(e,n){return r.useState((function(){return t.observable(e(),n,{autoBind:!0})}))[0]},exports.useLocalStore=function(e,n){var o=n&&R(n);return r.useState((function(){return t.observable(e(o),void 0,{autoBind:!0})}))[0]},exports.useObserver=function(e,t){return void 0===t&&(t="observed"),m(e,t)},exports.useStaticRendering=function(e){l(e)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,r=require("mobx"),t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,o=require("react-dom"),i=require("use-sync-external-store/shim");if(!t.useState)throw new Error("mobx-react-lite requires React with Hooks support");if(!r.makeObservable)throw new Error("mobx-react-lite@3 requires mobx at least version 6 to be available");function a(e){e()}function s(e){e||(e=a),r.configure({reactionScheduler:e})}function u(e){return r.getDependencyTree(e)}var c=!1;function l(e){c=e}function f(){return c}var p,d,b=new("undefined"!=typeof FinalizationRegistry?FinalizationRegistry:function(){function e(e){var r=this;this.finalize=void 0,this.registrations=new Map,this.sweepTimeout=void 0,this.sweep=function(e){void 0===e&&(e=1e4),clearTimeout(r.sweepTimeout),r.sweepTimeout=void 0;var t=Date.now();r.registrations.forEach((function(n,o){t-n.registeredAt>=e&&(r.finalize(n.value),r.registrations.delete(o))})),r.registrations.size>0&&r.scheduleSweep()},this.finalizeAllImmediately=function(){r.sweep(0)},this.finalize=e}var r=e.prototype;return r.register=function(e,r,t){this.registrations.set(t,{value:r,registeredAt:Date.now()}),this.scheduleSweep()},r.unregister=function(e){this.registrations.delete(e)},r.scheduleSweep=function(){void 0===this.sweepTimeout&&(this.sweepTimeout=setTimeout(this.sweep,1e4))},e}())((function(e){var r;null==(r=e.reaction)||r.dispose(),e.reaction=null}));function v(e){e.reaction=new r.Reaction("observer"+e.name,(function(){e.stateVersion=Symbol(),null==e.onStoreChange||e.onStoreChange()}))}function m(e,r){if(void 0===r&&(r="observed"),f())return e();var t=n.useRef(null);if(!t.current){var o={reaction:null,onStoreChange:null,stateVersion:Symbol(),name:r,subscribe:function(e){return b.unregister(o),o.onStoreChange=e,o.reaction||(v(o),o.stateVersion=Symbol()),function(){var e;o.onStoreChange=null,null==(e=o.reaction)||e.dispose(),o.reaction=null}},getSnapshot:function(){return o.stateVersion}};t.current=o}var a,s,c=t.current;if(c.reaction||(v(c),b.register(t,c,c)),n.useDebugValue(c.reaction,u),i.useSyncExternalStore(c.subscribe,c.getSnapshot,c.getSnapshot),c.reaction.track((function(){try{a=e()}catch(e){s=e}})),s)throw s;return a}var y,h="function"==typeof Symbol&&Symbol.for,g=null!=(p=null==(d=Object.getOwnPropertyDescriptor((function(){}),"name"))?void 0:d.configurable)&&p,w=h?Symbol.for("react.forward_ref"):"function"==typeof t.forwardRef&&t.forwardRef((function(e){return null})).$$typeof,S=h?Symbol.for("react.memo"):"function"==typeof t.memo&&t.memo((function(e){return null})).$$typeof,x={$$typeof:!0,render:!0,compare:!0,type:!0,displayName:!0};function O(e){var r=e.children,t=e.render;r&&t&&console.error("MobX Observer: Do not use children and render in the same time in `Observer`");var n=r||t;return"function"!=typeof n?null:m(n)}function R(e){var n=t.useState((function(){return r.observable(e,{},{deep:!1})}))[0];return r.runInAction((function(){Object.assign(n,e)})),n}O.displayName="Observer",s(o.unstable_batchedUpdates);var T=null!=(y=b.finalizeAllImmediately)?y:function(){};exports.Observer=O,exports._observerFinalizationRegistry=b,exports.clearTimers=T,exports.enableStaticRendering=l,exports.isObserverBatched=function(){return!0},exports.isUsingStaticRendering=f,exports.observer=function(e,r){var n;if(S&&e.$$typeof===S)throw new Error("[mobx-react-lite] You are trying to use `observer` on a function component wrapped in either another `observer` or `React.memo`. The observer already applies 'React.memo' for you.");if(f())return e;var o=null!=(n=null==r?void 0:r.forwardRef)&&n,i=e,a=e.displayName||e.name;if(w&&e.$$typeof===w&&(o=!0,"function"!=typeof(i=e.render)))throw new Error("[mobx-react-lite] `render` property of ForwardRef was not a function");var s,u,c=function(e,r){return m((function(){return i(e,r)}),a)};return c.displayName=e.displayName,g&&Object.defineProperty(c,"name",{value:e.name,writable:!0,configurable:!0}),e.contextTypes&&(c.contextTypes=e.contextTypes),o&&(c=t.forwardRef(c)),c=t.memo(c),s=e,u=c,Object.keys(s).forEach((function(e){x[e]||Object.defineProperty(u,e,Object.getOwnPropertyDescriptor(s,e))})),c},exports.observerBatching=s,exports.useAsObservableSource=R,exports.useLocalObservable=function(e,n){return t.useState((function(){return r.observable(e(),n,{autoBind:!0})}))[0]},exports.useLocalStore=function(e,n){var o=n&&R(n);return t.useState((function(){return r.observable(e(o),void 0,{autoBind:!0})}))[0]},exports.useObserver=function(e,r){return void 0===r&&(r="observed"),m(e,r)},exports.useStaticRendering=function(e){l(e)};
 //# sourceMappingURL=mobxreactlite.cjs.production.min.js.map

dist/mobxreactlite.esm.development.js

@@ -62,2 +62,3 @@ import { makeObservable, configure, getDependencyTree, Reaction, observable, runInAction } from 'mobx';
     this.sweepTimeout = void 0;
+    // Bound so it can be used directly as setTimeout callback.
     this.sweep = function (maxAge) {
@@ -81,2 +82,3 @@ if (maxAge === void 0) {
     };
+    // Bound so it can be exported directly as clearTimers test utility.
     this.finalizeAllImmediately = function () {
@@ -98,5 +100,3 @@ _this.sweep(0);
     this.registrations["delete"](token);
-  }
-  // Bound so it can be used directly as setTimeout callback.
-  ;
+  };
   _proto.scheduleSweep = function scheduleSweep() {
@@ -113,3 +113,3 @@ if (this.sweepTimeout === undefined) {
   var _adm$reaction;
-  (_adm$reaction = adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+  (_adm$reaction = adm.reaction) == null || _adm$reaction.dispose();
   adm.reaction = null;
@@ -124,3 +124,3 @@ });
     // `useSyncExternalStore` should handle that by checking the state version and issuing update.
-    adm.onStoreChange == null ? void 0 : adm.onStoreChange();
+    adm.onStoreChange == null || adm.onStoreChange();
   });
@@ -162,3 +162,3 @@ }
           _adm.onStoreChange = null;
-          (_adm$reaction = _adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+          (_adm$reaction = _adm.reaction) == null || _adm$reaction.dispose();
           _adm.reaction = null;
@@ -202,3 +202,2 @@ };
   }
-
   return renderResult;
@@ -209,2 +208,3 @@ }
 var warnObserverOptionsDeprecated = true;
+var warnLegacyContextTypes = true;
 var hasSymbol = typeof Symbol === "function" && Symbol["for"];
@@ -263,2 +263,6 @@ var isFunctionNameConfigurable = (_Object$getOwnPropert = (_Object$getOwnPropert2 = /*#__PURE__*/Object.getOwnPropertyDescriptor(function () {}, "name")) == null ? void 0 : _Object$getOwnPropert2.configurable) != null ? _Object$getOwnPropert : false;
     observerComponent.contextTypes = baseComponent.contextTypes;
+    if ( warnLegacyContextTypes) {
+      warnLegacyContextTypes = false;
+      console.warn("[mobx-react-lite] Support for Legacy Context in function components will be removed in the next major release.");
+    }
   }
@@ -307,2 +311,5 @@ if (useForwardRef) {
     render = _ref.render;
+  if (children && render) {
+    console.error("MobX Observer: Do not use children and render in the same time in `Observer`");
+  }
   var component = children || render;
@@ -309,0 +316,0 @@ if (typeof component !== "function") {

dist/mobxreactlite.esm.js

@@ -62,2 +62,3 @@ import { makeObservable, configure, getDependencyTree, Reaction, observable, runInAction } from 'mobx';
     this.sweepTimeout = void 0;
+    // Bound so it can be used directly as setTimeout callback.
     this.sweep = function (maxAge) {
@@ -81,2 +82,3 @@ if (maxAge === void 0) {
     };
+    // Bound so it can be exported directly as clearTimers test utility.
     this.finalizeAllImmediately = function () {
@@ -98,5 +100,3 @@ _this.sweep(0);
     this.registrations["delete"](token);
-  }
-  // Bound so it can be used directly as setTimeout callback.
-  ;
+  };
   _proto.scheduleSweep = function scheduleSweep() {
@@ -113,3 +113,3 @@ if (this.sweepTimeout === undefined) {
   var _adm$reaction;
-  (_adm$reaction = adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+  (_adm$reaction = adm.reaction) == null || _adm$reaction.dispose();
   adm.reaction = null;
@@ -124,3 +124,3 @@ });
     // `useSyncExternalStore` should handle that by checking the state version and issuing update.
-    adm.onStoreChange == null ? void 0 : adm.onStoreChange();
+    adm.onStoreChange == null || adm.onStoreChange();
   });
@@ -162,3 +162,3 @@ }
           _adm.onStoreChange = null;
-          (_adm$reaction = _adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+          (_adm$reaction = _adm.reaction) == null || _adm$reaction.dispose();
           _adm.reaction = null;
@@ -202,3 +202,2 @@ };
   }
-
   return renderResult;
@@ -209,2 +208,3 @@ }
 var warnObserverOptionsDeprecated = true;
+var warnLegacyContextTypes = true;
 var hasSymbol = typeof Symbol === "function" && Symbol["for"];
@@ -263,2 +263,6 @@ var isFunctionNameConfigurable = (_Object$getOwnPropert = (_Object$getOwnPropert2 = /*#__PURE__*/Object.getOwnPropertyDescriptor(function () {}, "name")) == null ? void 0 : _Object$getOwnPropert2.configurable) != null ? _Object$getOwnPropert : false;
     observerComponent.contextTypes = baseComponent.contextTypes;
+    if (process.env.NODE_ENV !== "production" && warnLegacyContextTypes) {
+      warnLegacyContextTypes = false;
+      console.warn("[mobx-react-lite] Support for Legacy Context in function components will be removed in the next major release.");
+    }
   }
@@ -307,2 +311,5 @@ if (useForwardRef) {
     render = _ref.render;
+  if (children && render) {
+    console.error("MobX Observer: Do not use children and render in the same time in `Observer`");
+  }
   var component = children || render;
@@ -309,0 +316,0 @@ if (typeof component !== "function") {

dist/mobxreactlite.esm.production.min.js

@@ -1,2 +0,2 @@
-import{makeObservable as e,configure as t,getDependencyTree as r,Reaction as n,observable as o,runInAction as i}from"mobx";import a,{useState as u,forwardRef as s,memo as c}from"react";import{unstable_batchedUpdates as f}from"react-dom";import{useSyncExternalStore as l}from"use-sync-external-store/shim";if(!u)throw new Error("mobx-react-lite requires React with Hooks support");if(!e)throw new Error("mobx-react-lite@3 requires mobx at least version 6 to be available");function p(e){e()}function m(e){e||(e=p),t({reactionScheduler:e})}var d=function(){return!0};function v(e){return r(e)}var y=!1;function b(e){y=e}function h(){return y}var w,g,S=new("undefined"!=typeof FinalizationRegistry?FinalizationRegistry:function(){function e(e){var t=this;this.finalize=void 0,this.registrations=new Map,this.sweepTimeout=void 0,this.sweep=function(e){void 0===e&&(e=1e4),clearTimeout(t.sweepTimeout),t.sweepTimeout=void 0;var r=Date.now();t.registrations.forEach((function(n,o){r-n.registeredAt>=e&&(t.finalize(n.value),t.registrations.delete(o))})),t.registrations.size>0&&t.scheduleSweep()},this.finalizeAllImmediately=function(){t.sweep(0)},this.finalize=e}var t=e.prototype;return t.register=function(e,t,r){this.registrations.set(r,{value:t,registeredAt:Date.now()}),this.scheduleSweep()},t.unregister=function(e){this.registrations.delete(e)},t.scheduleSweep=function(){void 0===this.sweepTimeout&&(this.sweepTimeout=setTimeout(this.sweep,1e4))},e}())((function(e){var t;null==(t=e.reaction)||t.dispose(),e.reaction=null}));function x(e){e.reaction=new n("observer"+e.name,(function(){e.stateVersion=Symbol(),null==e.onStoreChange||e.onStoreChange()}))}function O(e,t){if(void 0===t&&(t="observed"),h())return e();var r=a.useRef(null);if(!r.current){var n={reaction:null,onStoreChange:null,stateVersion:Symbol(),name:t,subscribe:function(e){return S.unregister(n),n.onStoreChange=e,n.reaction||(x(n),n.stateVersion=Symbol()),function(){var e;n.onStoreChange=null,null==(e=n.reaction)||e.dispose(),n.reaction=null}},getSnapshot:function(){return n.stateVersion}};r.current=n}var o,i,u=r.current;if(u.reaction||(x(u),S.register(r,u,u)),a.useDebugValue(u.reaction,v),l(u.subscribe,u.getSnapshot,u.getSnapshot),u.reaction.track((function(){try{o=e()}catch(e){i=e}})),i)throw i;return o}var T="function"==typeof Symbol&&Symbol.for,$=null!=(w=null==(g=Object.getOwnPropertyDescriptor((function(){}),"name"))?void 0:g.configurable)&&w,z=T?Symbol.for("react.forward_ref"):"function"==typeof s&&s((function(e){return null})).$$typeof,R=T?Symbol.for("react.memo"):"function"==typeof c&&c((function(e){return null})).$$typeof;function j(e,t){var r;if(R&&e.$$typeof===R)throw new Error("[mobx-react-lite] You are trying to use `observer` on a function component wrapped in either another `observer` or `React.memo`. The observer already applies 'React.memo' for you.");if(h())return e;var n=null!=(r=null==t?void 0:t.forwardRef)&&r,o=e,i=e.displayName||e.name;if(z&&e.$$typeof===z&&(n=!0,"function"!=typeof(o=e.render)))throw new Error("[mobx-react-lite] `render` property of ForwardRef was not a function");var a,u,f=function(e,t){return O((function(){return o(e,t)}),i)};return f.displayName=e.displayName,$&&Object.defineProperty(f,"name",{value:e.name,writable:!0,configurable:!0}),e.contextTypes&&(f.contextTypes=e.contextTypes),n&&(f=s(f)),f=c(f),a=e,u=f,Object.keys(a).forEach((function(e){C[e]||Object.defineProperty(u,e,Object.getOwnPropertyDescriptor(a,e))})),f}var E,C={$$typeof:!0,render:!0,compare:!0,type:!0,displayName:!0};function D(e){var t=e.children||e.render;return"function"!=typeof t?null:O(t)}function N(e,t){return u((function(){return o(e(),t,{autoBind:!0})}))[0]}function V(e){var t=u((function(){return o(e,{},{deep:!1})}))[0];return i((function(){Object.assign(t,e)})),t}function A(e,t){var r=t&&V(t);return u((function(){return o(e(r),void 0,{autoBind:!0})}))[0]}D.displayName="Observer",m(f);var F=null!=(E=S.finalizeAllImmediately)?E:function(){};function P(e,t){return void 0===t&&(t="observed"),O(e,t)}function k(e){b(e)}export{D as Observer,S as _observerFinalizationRegistry,F as clearTimers,b as enableStaticRendering,d as isObserverBatched,h as isUsingStaticRendering,j as observer,m as observerBatching,V as useAsObservableSource,N as useLocalObservable,A as useLocalStore,P as useObserver,k as useStaticRendering};
+import{makeObservable as e,configure as r,getDependencyTree as t,Reaction as n,observable as o,runInAction as i}from"mobx";import a,{useState as u,forwardRef as s,memo as c}from"react";import{unstable_batchedUpdates as f}from"react-dom";import{useSyncExternalStore as l}from"use-sync-external-store/shim";if(!u)throw new Error("mobx-react-lite requires React with Hooks support");if(!e)throw new Error("mobx-react-lite@3 requires mobx at least version 6 to be available");function p(e){e()}function m(e){e||(e=p),r({reactionScheduler:e})}var d=function(){return!0};function v(e){return t(e)}var y=!1;function b(e){y=e}function h(){return y}var w,g,S=new("undefined"!=typeof FinalizationRegistry?FinalizationRegistry:function(){function e(e){var r=this;this.finalize=void 0,this.registrations=new Map,this.sweepTimeout=void 0,this.sweep=function(e){void 0===e&&(e=1e4),clearTimeout(r.sweepTimeout),r.sweepTimeout=void 0;var t=Date.now();r.registrations.forEach((function(n,o){t-n.registeredAt>=e&&(r.finalize(n.value),r.registrations.delete(o))})),r.registrations.size>0&&r.scheduleSweep()},this.finalizeAllImmediately=function(){r.sweep(0)},this.finalize=e}var r=e.prototype;return r.register=function(e,r,t){this.registrations.set(t,{value:r,registeredAt:Date.now()}),this.scheduleSweep()},r.unregister=function(e){this.registrations.delete(e)},r.scheduleSweep=function(){void 0===this.sweepTimeout&&(this.sweepTimeout=setTimeout(this.sweep,1e4))},e}())((function(e){var r;null==(r=e.reaction)||r.dispose(),e.reaction=null}));function O(e){e.reaction=new n("observer"+e.name,(function(){e.stateVersion=Symbol(),null==e.onStoreChange||e.onStoreChange()}))}function x(e,r){if(void 0===r&&(r="observed"),h())return e();var t=a.useRef(null);if(!t.current){var n={reaction:null,onStoreChange:null,stateVersion:Symbol(),name:r,subscribe:function(e){return S.unregister(n),n.onStoreChange=e,n.reaction||(O(n),n.stateVersion=Symbol()),function(){var e;n.onStoreChange=null,null==(e=n.reaction)||e.dispose(),n.reaction=null}},getSnapshot:function(){return n.stateVersion}};t.current=n}var o,i,u=t.current;if(u.reaction||(O(u),S.register(t,u,u)),a.useDebugValue(u.reaction,v),l(u.subscribe,u.getSnapshot,u.getSnapshot),u.reaction.track((function(){try{o=e()}catch(e){i=e}})),i)throw i;return o}var T="function"==typeof Symbol&&Symbol.for,$=null!=(w=null==(g=Object.getOwnPropertyDescriptor((function(){}),"name"))?void 0:g.configurable)&&w,z=T?Symbol.for("react.forward_ref"):"function"==typeof s&&s((function(e){return null})).$$typeof,R=T?Symbol.for("react.memo"):"function"==typeof c&&c((function(e){return null})).$$typeof;function j(e,r){var t;if(R&&e.$$typeof===R)throw new Error("[mobx-react-lite] You are trying to use `observer` on a function component wrapped in either another `observer` or `React.memo`. The observer already applies 'React.memo' for you.");if(h())return e;var n=null!=(t=null==r?void 0:r.forwardRef)&&t,o=e,i=e.displayName||e.name;if(z&&e.$$typeof===z&&(n=!0,"function"!=typeof(o=e.render)))throw new Error("[mobx-react-lite] `render` property of ForwardRef was not a function");var a,u,f=function(e,r){return x((function(){return o(e,r)}),i)};return f.displayName=e.displayName,$&&Object.defineProperty(f,"name",{value:e.name,writable:!0,configurable:!0}),e.contextTypes&&(f.contextTypes=e.contextTypes),n&&(f=s(f)),f=c(f),a=e,u=f,Object.keys(a).forEach((function(e){E[e]||Object.defineProperty(u,e,Object.getOwnPropertyDescriptor(a,e))})),f}var D,E={$$typeof:!0,render:!0,compare:!0,type:!0,displayName:!0};function C(e){var r=e.children,t=e.render;r&&t&&console.error("MobX Observer: Do not use children and render in the same time in `Observer`");var n=r||t;return"function"!=typeof n?null:x(n)}function N(e,r){return u((function(){return o(e(),r,{autoBind:!0})}))[0]}function V(e){var r=u((function(){return o(e,{},{deep:!1})}))[0];return i((function(){Object.assign(r,e)})),r}function A(e,r){var t=r&&V(r);return u((function(){return o(e(t),void 0,{autoBind:!0})}))[0]}C.displayName="Observer",m(f);var F=null!=(D=S.finalizeAllImmediately)?D:function(){};function P(e,r){return void 0===r&&(r="observed"),x(e,r)}function k(e){b(e)}export{C as Observer,S as _observerFinalizationRegistry,F as clearTimers,b as enableStaticRendering,d as isObserverBatched,h as isUsingStaticRendering,j as observer,m as observerBatching,V as useAsObservableSource,N as useLocalObservable,A as useLocalStore,P as useObserver,k as useStaticRendering};
 //# sourceMappingURL=mobxreactlite.esm.production.min.js.map

dist/mobxreactlite.umd.development.js

@@ -65,2 +65,3 @@ (function (global, factory) {
         this.sweepTimeout = void 0;
+        // Bound so it can be used directly as setTimeout callback.
         this.sweep = function (maxAge) {
@@ -84,2 +85,3 @@ if (maxAge === void 0) {
         };
+        // Bound so it can be exported directly as clearTimers test utility.
         this.finalizeAllImmediately = function () {
@@ -101,5 +103,3 @@ _this.sweep(0);
         this.registrations["delete"](token);
-      }
-      // Bound so it can be used directly as setTimeout callback.
-      ;
+      };
       _proto.scheduleSweep = function scheduleSweep() {
@@ -116,3 +116,3 @@ if (this.sweepTimeout === undefined) {
       var _adm$reaction;
-      (_adm$reaction = adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+      (_adm$reaction = adm.reaction) == null || _adm$reaction.dispose();
       adm.reaction = null;
@@ -127,3 +127,3 @@ });
         // `useSyncExternalStore` should handle that by checking the state version and issuing update.
-        adm.onStoreChange == null ? void 0 : adm.onStoreChange();
+        adm.onStoreChange == null || adm.onStoreChange();
       });
@@ -165,3 +165,3 @@ }
               _adm.onStoreChange = null;
-              (_adm$reaction = _adm.reaction) == null ? void 0 : _adm$reaction.dispose();
+              (_adm$reaction = _adm.reaction) == null || _adm$reaction.dispose();
               _adm.reaction = null;
@@ -205,3 +205,2 @@ };
       }
-
       return renderResult;
@@ -212,2 +211,3 @@ }
     var warnObserverOptionsDeprecated = true;
+    var warnLegacyContextTypes = true;
     var hasSymbol = typeof Symbol === "function" && Symbol["for"];
@@ -266,2 +266,6 @@ var isFunctionNameConfigurable = (_Object$getOwnPropert = (_Object$getOwnPropert2 = /*#__PURE__*/Object.getOwnPropertyDescriptor(function () {}, "name")) == null ? void 0 : _Object$getOwnPropert2.configurable) != null ? _Object$getOwnPropert : false;
         observerComponent.contextTypes = baseComponent.contextTypes;
+        if ( warnLegacyContextTypes) {
+          warnLegacyContextTypes = false;
+          console.warn("[mobx-react-lite] Support for Legacy Context in function components will be removed in the next major release.");
+        }
       }
@@ -310,2 +314,5 @@ if (useForwardRef) {
         render = _ref.render;
+      if (children && render) {
+        console.error("MobX Observer: Do not use children and render in the same time in `Observer`");
+      }
       var component = children || render;
@@ -312,0 +319,0 @@ if (typeof component !== "function") {

dist/mobxreactlite.umd.production.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("mobx"),require("react"),require("react-dom"),require("use-sync-external-store/shim")):"function"==typeof define&&define.amd?define(["exports","mobx","react","react-dom","use-sync-external-store/shim"],t):t((e=e||self).mobxReactLite={},e.mobx,e.React,e.ReactDOM,e.shim)}(this,(function(e,t,r,n,o){"use strict";var i="default"in r?r.default:r;if(!r.useState)throw new Error("mobx-react-lite requires React with Hooks support");if(!t.makeObservable)throw new Error("mobx-react-lite@3 requires mobx at least version 6 to be available");function a(e){e()}function u(e){e||(e=a),t.configure({reactionScheduler:e})}function s(e){return t.getDependencyTree(e)}var c=!1;function f(e){c=e}function l(){return c}var d,p,b=new("undefined"!=typeof FinalizationRegistry?FinalizationRegistry:function(){function e(e){var t=this;this.finalize=void 0,this.registrations=new Map,this.sweepTimeout=void 0,this.sweep=function(e){void 0===e&&(e=1e4),clearTimeout(t.sweepTimeout),t.sweepTimeout=void 0;var r=Date.now();t.registrations.forEach((function(n,o){r-n.registeredAt>=e&&(t.finalize(n.value),t.registrations.delete(o))})),t.registrations.size>0&&t.scheduleSweep()},this.finalizeAllImmediately=function(){t.sweep(0)},this.finalize=e}var t=e.prototype;return t.register=function(e,t,r){this.registrations.set(r,{value:t,registeredAt:Date.now()}),this.scheduleSweep()},t.unregister=function(e){this.registrations.delete(e)},t.scheduleSweep=function(){void 0===this.sweepTimeout&&(this.sweepTimeout=setTimeout(this.sweep,1e4))},e}())((function(e){var t;null==(t=e.reaction)||t.dispose(),e.reaction=null}));function m(e){e.reaction=new t.Reaction("observer"+e.name,(function(){e.stateVersion=Symbol(),null==e.onStoreChange||e.onStoreChange()}))}function v(e,t){if(void 0===t&&(t="observed"),l())return e();var r=i.useRef(null);if(!r.current){var n={reaction:null,onStoreChange:null,stateVersion:Symbol(),name:t,subscribe:function(e){return b.unregister(n),n.onStoreChange=e,n.reaction||(m(n),n.stateVersion=Symbol()),function(){var e;n.onStoreChange=null,null==(e=n.reaction)||e.dispose(),n.reaction=null}},getSnapshot:function(){return n.stateVersion}};r.current=n}var a,u,c=r.current;if(c.reaction||(m(c),b.register(r,c,c)),i.useDebugValue(c.reaction,s),o.useSyncExternalStore(c.subscribe,c.getSnapshot,c.getSnapshot),c.reaction.track((function(){try{a=e()}catch(e){u=e}})),u)throw u;return a}var y,h="function"==typeof Symbol&&Symbol.for,g=null!=(d=null==(p=Object.getOwnPropertyDescriptor((function(){}),"name"))?void 0:p.configurable)&&d,w=h?Symbol.for("react.forward_ref"):"function"==typeof r.forwardRef&&r.forwardRef((function(e){return null})).$$typeof,S=h?Symbol.for("react.memo"):"function"==typeof r.memo&&r.memo((function(e){return null})).$$typeof,R={$$typeof:!0,render:!0,compare:!0,type:!0,displayName:!0};function x(e){var t=e.children||e.render;return"function"!=typeof t?null:v(t)}function O(e){var n=r.useState((function(){return t.observable(e,{},{deep:!1})}))[0];return t.runInAction((function(){Object.assign(n,e)})),n}x.displayName="Observer",u(n.unstable_batchedUpdates);var T=null!=(y=b.finalizeAllImmediately)?y:function(){};e.Observer=x,e._observerFinalizationRegistry=b,e.clearTimers=T,e.enableStaticRendering=f,e.isObserverBatched=function(){return!0},e.isUsingStaticRendering=l,e.observer=function(e,t){var n;if(S&&e.$$typeof===S)throw new Error("[mobx-react-lite] You are trying to use `observer` on a function component wrapped in either another `observer` or `React.memo`. The observer already applies 'React.memo' for you.");if(l())return e;var o=null!=(n=null==t?void 0:t.forwardRef)&&n,i=e,a=e.displayName||e.name;if(w&&e.$$typeof===w&&(o=!0,"function"!=typeof(i=e.render)))throw new Error("[mobx-react-lite] `render` property of ForwardRef was not a function");var u,s,c=function(e,t){return v((function(){return i(e,t)}),a)};return c.displayName=e.displayName,g&&Object.defineProperty(c,"name",{value:e.name,writable:!0,configurable:!0}),e.contextTypes&&(c.contextTypes=e.contextTypes),o&&(c=r.forwardRef(c)),c=r.memo(c),u=e,s=c,Object.keys(u).forEach((function(e){R[e]||Object.defineProperty(s,e,Object.getOwnPropertyDescriptor(u,e))})),c},e.observerBatching=u,e.useAsObservableSource=O,e.useLocalObservable=function(e,n){return r.useState((function(){return t.observable(e(),n,{autoBind:!0})}))[0]},e.useLocalStore=function(e,n){var o=n&&O(n);return r.useState((function(){return t.observable(e(o),void 0,{autoBind:!0})}))[0]},e.useObserver=function(e,t){return void 0===t&&(t="observed"),v(e,t)},e.useStaticRendering=function(e){f(e)},Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("mobx"),require("react"),require("react-dom"),require("use-sync-external-store/shim")):"function"==typeof define&&define.amd?define(["exports","mobx","react","react-dom","use-sync-external-store/shim"],t):t((e=e||self).mobxReactLite={},e.mobx,e.React,e.ReactDOM,e.shim)}(this,(function(e,t,r,n,o){"use strict";var i="default"in r?r.default:r;if(!r.useState)throw new Error("mobx-react-lite requires React with Hooks support");if(!t.makeObservable)throw new Error("mobx-react-lite@3 requires mobx at least version 6 to be available");function a(e){e()}function u(e){e||(e=a),t.configure({reactionScheduler:e})}function s(e){return t.getDependencyTree(e)}var c=!1;function f(e){c=e}function l(){return c}var d,b,p=new("undefined"!=typeof FinalizationRegistry?FinalizationRegistry:function(){function e(e){var t=this;this.finalize=void 0,this.registrations=new Map,this.sweepTimeout=void 0,this.sweep=function(e){void 0===e&&(e=1e4),clearTimeout(t.sweepTimeout),t.sweepTimeout=void 0;var r=Date.now();t.registrations.forEach((function(n,o){r-n.registeredAt>=e&&(t.finalize(n.value),t.registrations.delete(o))})),t.registrations.size>0&&t.scheduleSweep()},this.finalizeAllImmediately=function(){t.sweep(0)},this.finalize=e}var t=e.prototype;return t.register=function(e,t,r){this.registrations.set(r,{value:t,registeredAt:Date.now()}),this.scheduleSweep()},t.unregister=function(e){this.registrations.delete(e)},t.scheduleSweep=function(){void 0===this.sweepTimeout&&(this.sweepTimeout=setTimeout(this.sweep,1e4))},e}())((function(e){var t;null==(t=e.reaction)||t.dispose(),e.reaction=null}));function m(e){e.reaction=new t.Reaction("observer"+e.name,(function(){e.stateVersion=Symbol(),null==e.onStoreChange||e.onStoreChange()}))}function v(e,t){if(void 0===t&&(t="observed"),l())return e();var r=i.useRef(null);if(!r.current){var n={reaction:null,onStoreChange:null,stateVersion:Symbol(),name:t,subscribe:function(e){return p.unregister(n),n.onStoreChange=e,n.reaction||(m(n),n.stateVersion=Symbol()),function(){var e;n.onStoreChange=null,null==(e=n.reaction)||e.dispose(),n.reaction=null}},getSnapshot:function(){return n.stateVersion}};r.current=n}var a,u,c=r.current;if(c.reaction||(m(c),p.register(r,c,c)),i.useDebugValue(c.reaction,s),o.useSyncExternalStore(c.subscribe,c.getSnapshot,c.getSnapshot),c.reaction.track((function(){try{a=e()}catch(e){u=e}})),u)throw u;return a}var y,h="function"==typeof Symbol&&Symbol.for,g=null!=(d=null==(b=Object.getOwnPropertyDescriptor((function(){}),"name"))?void 0:b.configurable)&&d,w=h?Symbol.for("react.forward_ref"):"function"==typeof r.forwardRef&&r.forwardRef((function(e){return null})).$$typeof,S=h?Symbol.for("react.memo"):"function"==typeof r.memo&&r.memo((function(e){return null})).$$typeof,O={$$typeof:!0,render:!0,compare:!0,type:!0,displayName:!0};function R(e){var t=e.children,r=e.render;t&&r&&console.error("MobX Observer: Do not use children and render in the same time in `Observer`");var n=t||r;return"function"!=typeof n?null:v(n)}function x(e){var n=r.useState((function(){return t.observable(e,{},{deep:!1})}))[0];return t.runInAction((function(){Object.assign(n,e)})),n}R.displayName="Observer",u(n.unstable_batchedUpdates);var T=null!=(y=p.finalizeAllImmediately)?y:function(){};e.Observer=R,e._observerFinalizationRegistry=p,e.clearTimers=T,e.enableStaticRendering=f,e.isObserverBatched=function(){return!0},e.isUsingStaticRendering=l,e.observer=function(e,t){var n;if(S&&e.$$typeof===S)throw new Error("[mobx-react-lite] You are trying to use `observer` on a function component wrapped in either another `observer` or `React.memo`. The observer already applies 'React.memo' for you.");if(l())return e;var o=null!=(n=null==t?void 0:t.forwardRef)&&n,i=e,a=e.displayName||e.name;if(w&&e.$$typeof===w&&(o=!0,"function"!=typeof(i=e.render)))throw new Error("[mobx-react-lite] `render` property of ForwardRef was not a function");var u,s,c=function(e,t){return v((function(){return i(e,t)}),a)};return c.displayName=e.displayName,g&&Object.defineProperty(c,"name",{value:e.name,writable:!0,configurable:!0}),e.contextTypes&&(c.contextTypes=e.contextTypes),o&&(c=r.forwardRef(c)),c=r.memo(c),u=e,s=c,Object.keys(u).forEach((function(e){O[e]||Object.defineProperty(s,e,Object.getOwnPropertyDescriptor(u,e))})),c},e.observerBatching=u,e.useAsObservableSource=x,e.useLocalObservable=function(e,n){return r.useState((function(){return t.observable(e(),n,{autoBind:!0})}))[0]},e.useLocalStore=function(e,n){var o=n&&x(n);return r.useState((function(){return t.observable(e(o),void 0,{autoBind:!0})}))[0]},e.useObserver=function(e,t){return void 0===t&&(t="observed"),v(e,t)},e.useStaticRendering=function(e){f(e)},Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=mobxreactlite.umd.production.min.js.map

dist/observer.d.ts

@@ -1,6 +0,17 @@
-/// <reference types="react" />
+/**
+ * @deprecated Observer options will be removed in the next major version of mobx-react-lite.
+ * Look at the individual properties for alternatives.
+ */
 export interface IObserverOptions {
+    /**
+     * @deprecated Pass a `React.forwardRef` component to observer instead of using the options object
+     * e.g. `observer(React.forwardRef(fn))`
+     */
     readonly forwardRef?: boolean;
 }
 export declare function observer<P extends object, TRef = {}>(baseComponent: React.ForwardRefRenderFunction<TRef, P>, options: IObserverOptions & {
+    /**
+     * @deprecated Pass a `React.forwardRef` component to observer instead of using the options object
+     * e.g. `observer(React.forwardRef(fn))`
+     */
     forwardRef: true;
@@ -7,0 +18,0 @@ }): React.MemoExoticComponent<React.ForwardRefExoticComponent<React.PropsWithoutRef<P> & React.RefAttributes<TRef>>>;

dist/ObserverComponent.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 interface IObserverProps {
@@ -3,0 +2,0 @@ children?(): React.ReactElement | null;

es/observer.js

@@ -6,2 +6,3 @@ var _a, _b;
 var warnObserverOptionsDeprecated = true;
+var warnLegacyContextTypes = true;
 var hasSymbol = typeof Symbol === "function" && Symbol.for;
@@ -59,2 +60,6 @@ var isFunctionNameConfigurable = (_b = (_a = Object.getOwnPropertyDescriptor(function () { }, "name")) === null || _a === void 0 ? void 0 : _a.configurable) !== null && _b !== void 0 ? _b : false;
         observerComponent.contextTypes = baseComponent.contextTypes;
+        if (process.env.NODE_ENV !== "production" && warnLegacyContextTypes) {
+            warnLegacyContextTypes = false;
+            console.warn("[mobx-react-lite] Support for Legacy Context in function components will be removed in the next major release.");
+        }
     }
@@ -61,0 +66,0 @@ if (useForwardRef) {

es/ObserverComponent.js

 import { useObserver } from "./useObserver";
 function ObserverComponent(_a) {
     var children = _a.children, render = _a.render;
+    if (children && render) {
+        console.error("MobX Observer: Do not use children and render in the same time in `Observer`");
+    }
     var component = children || render;
@@ -5,0 +8,0 @@ if (typeof component !== "function") {

lib/index.js

 "use strict";
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useStaticRendering = exports.observerBatching = exports.isObserverBatched = exports.useObserver = exports.clearTimers = exports._observerFinalizationRegistry = exports.useAsObservableSource = exports.useLocalStore = exports.useLocalObservable = exports.Observer = exports.observer = exports.enableStaticRendering = exports.isUsingStaticRendering = void 0;
+exports.observerBatching = exports.isObserverBatched = exports.clearTimers = exports._observerFinalizationRegistry = exports.useAsObservableSource = exports.useLocalStore = exports.useLocalObservable = exports.Observer = exports.observer = exports.enableStaticRendering = exports.isUsingStaticRendering = void 0;
+exports.useObserver = useObserver;
+exports.useStaticRendering = useStaticRendering;
 require("./utils/assertEnvironment");
@@ -35,3 +37,2 @@ var reactBatchedUpdates_1 = require("./utils/reactBatchedUpdates");
 }
-exports.useObserver = useObserver;
 var observerBatching_2 = require("./utils/observerBatching");
@@ -46,3 +47,2 @@ Object.defineProperty(exports, "isObserverBatched", { enumerable: true, get: function () { return observerBatching_2.isObserverBatched; } });
 }
-exports.useStaticRendering = useStaticRendering;
 //# sourceMappingURL=index.js.map

lib/observer.js

 "use strict";
 var _a, _b;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.observer = void 0;
+exports.observer = observer;
 var react_1 = require("react");
@@ -9,2 +9,3 @@ var staticRendering_1 = require("./staticRendering");
 var warnObserverOptionsDeprecated = true;
+var warnLegacyContextTypes = true;
 var hasSymbol = typeof Symbol === "function" && Symbol.for;
@@ -62,2 +63,6 @@ var isFunctionNameConfigurable = (_b = (_a = Object.getOwnPropertyDescriptor(function () { }, "name")) === null || _a === void 0 ? void 0 : _a.configurable) !== null && _b !== void 0 ? _b : false;
         observerComponent.contextTypes = baseComponent.contextTypes;
+        if (process.env.NODE_ENV !== "production" && warnLegacyContextTypes) {
+            warnLegacyContextTypes = false;
+            console.warn("[mobx-react-lite] Support for Legacy Context in function components will be removed in the next major release.");
+        }
     }
@@ -85,3 +90,2 @@ if (useForwardRef) {
 }
-exports.observer = observer;
 // based on https://github.com/mridgway/hoist-non-react-statics/blob/master/src/index.js
@@ -88,0 +92,0 @@ var hoistBlackList = {

lib/ObserverComponent.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Observer = void 0;
+exports.Observer = ObserverComponent;
 var useObserver_1 = require("./useObserver");
 function ObserverComponent(_a) {
     var children = _a.children, render = _a.render;
+    if (children && render) {
+        console.error("MobX Observer: Do not use children and render in the same time in `Observer`");
+    }
     var component = children || render;
@@ -13,3 +16,2 @@ if (typeof component !== "function") {
 }
-exports.Observer = ObserverComponent;
 if ("production" !== process.env.NODE_ENV) {
@@ -16,0 +18,0 @@ ObserverComponent.propTypes = {

lib/staticRendering.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isUsingStaticRendering = exports.enableStaticRendering = void 0;
+exports.enableStaticRendering = enableStaticRendering;
+exports.isUsingStaticRendering = isUsingStaticRendering;
 var globalIsUsingStaticRendering = false;
@@ -8,7 +9,5 @@ function enableStaticRendering(enable) {
 }
-exports.enableStaticRendering = enableStaticRendering;
 function isUsingStaticRendering() {
     return globalIsUsingStaticRendering;
 }
-exports.isUsingStaticRendering = isUsingStaticRendering;
 //# sourceMappingURL=staticRendering.js.map

lib/useAsObservableSource.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAsObservableSource = void 0;
+exports.useAsObservableSource = useAsObservableSource;
 var utils_1 = require("./utils/utils");
@@ -19,3 +19,2 @@ var mobx_1 = require("mobx");
 }
-exports.useAsObservableSource = useAsObservableSource;
 //# sourceMappingURL=useAsObservableSource.js.map

lib/useLocalObservable.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLocalObservable = void 0;
+exports.useLocalObservable = useLocalObservable;
 var mobx_1 = require("mobx");
@@ -9,3 +9,2 @@ var react_1 = require("react");
 }
-exports.useLocalObservable = useLocalObservable;
 //# sourceMappingURL=useLocalObservable.js.map

lib/useLocalStore.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLocalStore = void 0;
+exports.useLocalStore = useLocalStore;
 var mobx_1 = require("mobx");
@@ -15,3 +15,2 @@ var react_1 = require("react");
 }
-exports.useLocalStore = useLocalStore;
 //# sourceMappingURL=useLocalStore.js.map

lib/useObserver.js

@@ -6,3 +6,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useObserver = void 0;
+exports.useObserver = useObserver;
 var mobx_1 = require("mobx");
@@ -98,3 +98,2 @@ var react_1 = __importDefault(require("react"));
 }
-exports.useObserver = useObserver;
 //# sourceMappingURL=useObserver.js.map

lib/utils/observerBatching.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isObserverBatched = exports.observerBatching = exports.defaultNoopBatch = void 0;
+exports.isObserverBatched = void 0;
+exports.defaultNoopBatch = defaultNoopBatch;
+exports.observerBatching = observerBatching;
 var mobx_1 = require("mobx");
@@ -8,3 +10,2 @@ function defaultNoopBatch(callback) {
 }
-exports.defaultNoopBatch = defaultNoopBatch;
 function observerBatching(reactionScheduler) {
@@ -19,3 +20,2 @@ if (!reactionScheduler) {
 }
-exports.observerBatching = observerBatching;
 var isObserverBatched = function () {
@@ -22,0 +22,0 @@ if ("production" !== process.env.NODE_ENV) {

lib/utils/printDebugValue.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.printDebugValue = void 0;
+exports.printDebugValue = printDebugValue;
 var mobx_1 = require("mobx");
@@ -8,3 +8,2 @@ function printDebugValue(v) {
 }
-exports.printDebugValue = printDebugValue;
 //# sourceMappingURL=printDebugValue.js.map

lib/utils/utils.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDeprecated = void 0;
+exports.useDeprecated = useDeprecated;
 var deprecatedMessages = [];
@@ -11,3 +11,2 @@ function useDeprecated(msg) {
 }
-exports.useDeprecated = useDeprecated;
 //# sourceMappingURL=utils.js.map

package.json

 {
     "name": "mobx-react-lite",
-    "version": "4.0.7",
+    "version": "4.1.0",
     "description": "Lightweight React bindings for MobX based on React 16.8+ and Hooks",
@@ -40,7 +40,7 @@ "source": "src/index.ts",
     "dependencies": {
-        "use-sync-external-store": "^1.2.0"
+        "use-sync-external-store": "^1.4.0"
     },
     "peerDependencies": {
         "mobx": "^6.9.0",
-        "react": "^16.8.0 || ^17 || ^18"
+        "react": "^16.8.0 || ^17 || ^18 || ^19"
     },
@@ -47,0 +47,0 @@ "peerDependenciesMeta": {

src/observer.ts

@@ -7,2 +7,3 @@ import { forwardRef, memo } from "react"
 let warnObserverOptionsDeprecated = true
+let warnLegacyContextTypes = true
 
@@ -22,3 +23,11 @@ const hasSymbol = typeof Symbol === "function" && Symbol.for
 
+/**
+ * @deprecated Observer options will be removed in the next major version of mobx-react-lite.
+ * Look at the individual properties for alternatives.
+ */
 export interface IObserverOptions {
+    /**
+     * @deprecated Pass a `React.forwardRef` component to observer instead of using the options object
+     * e.g. `observer(React.forwardRef(fn))`
+     */
     readonly forwardRef?: boolean
@@ -29,3 +38,9 @@ }
     baseComponent: React.ForwardRefRenderFunction<TRef, P>,
-    options: IObserverOptions & { forwardRef: true }
+    options: IObserverOptions & {
+        /**
+         * @deprecated Pass a `React.forwardRef` component to observer instead of using the options object
+         * e.g. `observer(React.forwardRef(fn))`
+         */
+        forwardRef: true
+    }
 ): React.MemoExoticComponent<
@@ -129,2 +144,9 @@ React.ForwardRefExoticComponent<React.PropsWithoutRef<P> & React.RefAttributes<TRef>>
         ).contextTypes
+
+        if (process.env.NODE_ENV !== "production" && warnLegacyContextTypes) {
+            warnLegacyContextTypes = false
+            console.warn(
+                `[mobx-react-lite] Support for Legacy Context in function components will be removed in the next major release.`
+            )
+        }
     }
@@ -131,0 +153,0 @@

src/ObserverComponent.ts

 import { useObserver } from "./useObserver"
 
+// TODO: this type could be improved in the next major release:
+// type IObserverProps = { children: () => React.ReactNode, render?: never } | { children?: never, render: () => React.ReactNode }
 interface IObserverProps {
@@ -9,2 +11,7 @@ children?(): React.ReactElement | null
 function ObserverComponent({ children, render }: IObserverProps) {
+    if (children && render) {
+        console.error(
+            "MobX Observer: Do not use children and render in the same time in `Observer`"
+        )
+    }
     const component = children || render
@@ -11,0 +18,0 @@ if (typeof component !== "function") {

No alert changes

Improved metrics

Total package byte prevSize

423469

increased by3.86%

Lines of code

3152

increased by2.54%

Worsened metrics

Number of low supply chain risk alerts

31

increased by10.71%

Dependency changes

• + Addedreact@19.0.0(transitive)

• - Removedjs-tokens@4.0.0(transitive)

• - Removedloose-envify@1.4.0(transitive)

• - Removedreact@18.3.1(transitive)

• Updateduse-sync-external-store@^1.4.0