From cfabdb343ee6e01c0dbe8a0e69373a943d25ef86 Mon Sep 17 00:00:00 2001 From: acdlite Date: Tue, 10 Oct 2023 20:44:17 +0000 Subject: [PATCH] Add optional initialValue argument to useDeferredValue (#27500) Adds a second argument to useDeferredValue called initialValue: ```js const value = useDeferredValue(finalValue, initialValue); ``` During the initial render of a component, useDeferredValue will return initialValue. Once that render finishes, it will spawn an additional render to switch to finalValue. This same sequence should occur whenever the hook is hidden and revealed again, i.e. by a Suspense or Activity, though this part is not yet implemented. When initialValue is not provided, useDeferredValue has no effect during initial render, but during an update, it will remain on the previous value, then spawn an additional render to switch to the new value. (This is the same behavior that exists today.) During SSR, initialValue is always used, if provided. This feature is currently behind an experimental flag. We plan to ship it in a non-breaking release. DiffTrain build for [be67db46b60d94f9fbefccf2523429af25873e5b](https://github.com/facebook/react/commit/be67db46b60d94f9fbefccf2523429af25873e5b) --- compiled/facebook-www/REVISION | 2 +- compiled/facebook-www/React-dev.classic.js | 6 +- compiled/facebook-www/React-dev.modern.js | 6 +- compiled/facebook-www/React-prod.classic.js | 6 +- compiled/facebook-www/React-prod.modern.js | 6 +- .../facebook-www/React-profiling.classic.js | 6 +- .../facebook-www/React-profiling.modern.js | 6 +- compiled/facebook-www/ReactART-dev.classic.js | 73 +++++++++++++------ compiled/facebook-www/ReactART-dev.modern.js | 73 +++++++++++++------ .../facebook-www/ReactART-prod.classic.js | 39 ++++++---- compiled/facebook-www/ReactART-prod.modern.js | 39 ++++++---- compiled/facebook-www/ReactDOM-dev.classic.js | 73 +++++++++++++------ compiled/facebook-www/ReactDOM-dev.modern.js | 73 +++++++++++++------ .../facebook-www/ReactDOM-prod.classic.js | 41 +++++++---- compiled/facebook-www/ReactDOM-prod.modern.js | 41 +++++++---- .../ReactDOM-profiling.classic.js | 27 +++++-- .../facebook-www/ReactDOM-profiling.modern.js | 27 +++++-- .../ReactDOMServer-dev.classic.js | 16 ++-- .../facebook-www/ReactDOMServer-dev.modern.js | 16 ++-- .../ReactDOMServer-prod.classic.js | 12 ++- .../ReactDOMServer-prod.modern.js | 12 ++- .../ReactDOMServerStreaming-dev.modern.js | 14 +++- .../ReactDOMServerStreaming-prod.modern.js | 10 ++- .../ReactDOMTesting-dev.classic.js | 73 +++++++++++++------ .../ReactDOMTesting-dev.modern.js | 73 +++++++++++++------ .../ReactDOMTesting-prod.classic.js | 41 +++++++---- .../ReactDOMTesting-prod.modern.js | 41 +++++++---- .../ReactTestRenderer-dev.classic.js | 69 ++++++++++++------ .../ReactTestRenderer-dev.modern.js | 69 ++++++++++++------ 29 files changed, 679 insertions(+), 311 deletions(-) diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION index 0bc8b244d9..e926e95c02 100644 --- a/compiled/facebook-www/REVISION +++ b/compiled/facebook-www/REVISION @@ -1 +1 @@ -151e75a128d0fd436dce365335b96c5686f704d4 +be67db46b60d94f9fbefccf2523429af25873e5b diff --git a/compiled/facebook-www/React-dev.classic.js b/compiled/facebook-www/React-dev.classic.js index b4e3c0a4c3..19008086e8 100644 --- a/compiled/facebook-www/React-dev.classic.js +++ b/compiled/facebook-www/React-dev.classic.js @@ -27,7 +27,7 @@ if ( } "use strict"; -var ReactVersion = "18.3.0-www-classic-f4ae0982"; +var ReactVersion = "18.3.0-www-classic-5bedd128"; // ATTENTION // When adding new symbols to this file, @@ -1986,9 +1986,9 @@ function useTransition() { var dispatcher = resolveDispatcher(); return dispatcher.useTransition(); } -function useDeferredValue(value) { +function useDeferredValue(value, initialValue) { var dispatcher = resolveDispatcher(); - return dispatcher.useDeferredValue(value); + return dispatcher.useDeferredValue(value, initialValue); } function useId() { var dispatcher = resolveDispatcher(); diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js index b077240b49..113a1cca73 100644 --- a/compiled/facebook-www/React-dev.modern.js +++ b/compiled/facebook-www/React-dev.modern.js @@ -27,7 +27,7 @@ if ( } "use strict"; -var ReactVersion = "18.3.0-www-modern-06b61106"; +var ReactVersion = "18.3.0-www-modern-6dbff8b1"; // ATTENTION // When adding new symbols to this file, @@ -1986,9 +1986,9 @@ function useTransition() { var dispatcher = resolveDispatcher(); return dispatcher.useTransition(); } -function useDeferredValue(value) { +function useDeferredValue(value, initialValue) { var dispatcher = resolveDispatcher(); - return dispatcher.useDeferredValue(value); + return dispatcher.useDeferredValue(value, initialValue); } function useId() { var dispatcher = resolveDispatcher(); diff --git a/compiled/facebook-www/React-prod.classic.js b/compiled/facebook-www/React-prod.classic.js index 84e1e5c2cb..d68db9086f 100644 --- a/compiled/facebook-www/React-prod.classic.js +++ b/compiled/facebook-www/React-prod.classic.js @@ -576,8 +576,8 @@ exports.useContext = function (Context) { return ReactCurrentDispatcher.current.useContext(Context); }; exports.useDebugValue = function () {}; -exports.useDeferredValue = function (value) { - return ReactCurrentDispatcher.current.useDeferredValue(value); +exports.useDeferredValue = function (value, initialValue) { + return ReactCurrentDispatcher.current.useDeferredValue(value, initialValue); }; exports.useEffect = function (create, deps) { return ReactCurrentDispatcher.current.useEffect(create, deps); @@ -623,4 +623,4 @@ exports.useSyncExternalStore = function ( exports.useTransition = function () { return ReactCurrentDispatcher.current.useTransition(); }; -exports.version = "18.3.0-www-classic-b08870f0"; +exports.version = "18.3.0-www-classic-20c4b7b9"; diff --git a/compiled/facebook-www/React-prod.modern.js b/compiled/facebook-www/React-prod.modern.js index 61c76edcdf..03273aa934 100644 --- a/compiled/facebook-www/React-prod.modern.js +++ b/compiled/facebook-www/React-prod.modern.js @@ -568,8 +568,8 @@ exports.useContext = function (Context) { return ReactCurrentDispatcher.current.useContext(Context); }; exports.useDebugValue = function () {}; -exports.useDeferredValue = function (value) { - return ReactCurrentDispatcher.current.useDeferredValue(value); +exports.useDeferredValue = function (value, initialValue) { + return ReactCurrentDispatcher.current.useDeferredValue(value, initialValue); }; exports.useEffect = function (create, deps) { return ReactCurrentDispatcher.current.useEffect(create, deps); @@ -615,4 +615,4 @@ exports.useSyncExternalStore = function ( exports.useTransition = function () { return ReactCurrentDispatcher.current.useTransition(); }; -exports.version = "18.3.0-www-modern-20e3e48a"; +exports.version = "18.3.0-www-modern-1eaea04e"; diff --git a/compiled/facebook-www/React-profiling.classic.js b/compiled/facebook-www/React-profiling.classic.js index 48a882c645..6a8e6e21b6 100644 --- a/compiled/facebook-www/React-profiling.classic.js +++ b/compiled/facebook-www/React-profiling.classic.js @@ -587,8 +587,8 @@ exports.useContext = function (Context) { return ReactCurrentDispatcher.current.useContext(Context); }; exports.useDebugValue = function () {}; -exports.useDeferredValue = function (value) { - return ReactCurrentDispatcher.current.useDeferredValue(value); +exports.useDeferredValue = function (value, initialValue) { + return ReactCurrentDispatcher.current.useDeferredValue(value, initialValue); }; exports.useEffect = function (create, deps) { return ReactCurrentDispatcher.current.useEffect(create, deps); @@ -634,7 +634,7 @@ exports.useSyncExternalStore = function ( exports.useTransition = function () { return ReactCurrentDispatcher.current.useTransition(); }; -exports.version = "18.3.0-www-classic-fce6281b"; +exports.version = "18.3.0-www-classic-fcaf1567"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/React-profiling.modern.js b/compiled/facebook-www/React-profiling.modern.js index 18d438dc05..c55727854b 100644 --- a/compiled/facebook-www/React-profiling.modern.js +++ b/compiled/facebook-www/React-profiling.modern.js @@ -579,8 +579,8 @@ exports.useContext = function (Context) { return ReactCurrentDispatcher.current.useContext(Context); }; exports.useDebugValue = function () {}; -exports.useDeferredValue = function (value) { - return ReactCurrentDispatcher.current.useDeferredValue(value); +exports.useDeferredValue = function (value, initialValue) { + return ReactCurrentDispatcher.current.useDeferredValue(value, initialValue); }; exports.useEffect = function (create, deps) { return ReactCurrentDispatcher.current.useEffect(create, deps); @@ -626,7 +626,7 @@ exports.useSyncExternalStore = function ( exports.useTransition = function () { return ReactCurrentDispatcher.current.useTransition(); }; -exports.version = "18.3.0-www-modern-b51738eb"; +exports.version = "18.3.0-www-modern-316f00ed"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/ReactART-dev.classic.js b/compiled/facebook-www/ReactART-dev.classic.js index 06b92af65b..03baccc50e 100644 --- a/compiled/facebook-www/ReactART-dev.classic.js +++ b/compiled/facebook-www/ReactART-dev.classic.js @@ -69,7 +69,7 @@ function _assertThisInitialized(self) { return self; } -var ReactVersion = "18.3.0-www-classic-01513ba4"; +var ReactVersion = "18.3.0-www-classic-839801a3"; var LegacyRoot = 0; var ConcurrentRoot = 1; @@ -180,7 +180,9 @@ var replayFailedUnitOfWorkWithInvokeGuardedCallback = enableDO_NOT_USE_disableStrictPassiveEffect = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = - dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop; // On WWW, false is used for a new modern build. + dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, false is used for a new modern build. var enableProfilerTimer = true; var enableProfilerCommitHooks = true; var enableProfilerNestedUpdatePhase = true; @@ -9740,26 +9742,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -9767,7 +9767,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (enableUseDeferredValueInitialArg && initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -10463,10 +10492,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10602,10 +10631,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10739,7 +10768,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -10878,10 +10907,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -11033,11 +11062,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -11194,7 +11223,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -11355,11 +11384,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; diff --git a/compiled/facebook-www/ReactART-dev.modern.js b/compiled/facebook-www/ReactART-dev.modern.js index 832fbf4494..69c9b3dd34 100644 --- a/compiled/facebook-www/ReactART-dev.modern.js +++ b/compiled/facebook-www/ReactART-dev.modern.js @@ -69,7 +69,7 @@ function _assertThisInitialized(self) { return self; } -var ReactVersion = "18.3.0-www-modern-612d960e"; +var ReactVersion = "18.3.0-www-modern-7ef93208"; var LegacyRoot = 0; var ConcurrentRoot = 1; @@ -180,7 +180,9 @@ var replayFailedUnitOfWorkWithInvokeGuardedCallback = enableDO_NOT_USE_disableStrictPassiveEffect = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = - dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop; // On WWW, true is used for a new modern build. + dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, true is used for a new modern build. var enableProfilerTimer = true; var enableProfilerCommitHooks = true; var enableProfilerNestedUpdatePhase = true; @@ -9496,26 +9498,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -9523,7 +9523,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (enableUseDeferredValueInitialArg && initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -10219,10 +10248,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10358,10 +10387,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10495,7 +10524,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -10634,10 +10663,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10789,11 +10818,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10950,7 +10979,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -11111,11 +11140,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; diff --git a/compiled/facebook-www/ReactART-prod.classic.js b/compiled/facebook-www/ReactART-prod.classic.js index 3846df9535..96189c7ddb 100644 --- a/compiled/facebook-www/ReactART-prod.classic.js +++ b/compiled/facebook-www/ReactART-prod.classic.js @@ -77,6 +77,8 @@ var ReactSharedInternals = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, REACT_ELEMENT_TYPE = Symbol.for("react.element"), REACT_PORTAL_TYPE = Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"), @@ -3134,6 +3136,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -3429,8 +3441,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -3547,10 +3560,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -10109,10 +10122,10 @@ var slice = Array.prototype.slice, return null; }, bundleType: 0, - version: "18.3.0-www-classic-bf99e5b1", + version: "18.3.0-www-classic-1b19eb12", rendererPackageName: "react-art" }; -var internals$jscomp$inline_1304 = { +var internals$jscomp$inline_1306 = { bundleType: devToolsConfig$jscomp$inline_1131.bundleType, version: devToolsConfig$jscomp$inline_1131.version, rendererPackageName: devToolsConfig$jscomp$inline_1131.rendererPackageName, @@ -10140,19 +10153,19 @@ var internals$jscomp$inline_1304 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-bf99e5b1" + reconcilerVersion: "18.3.0-www-classic-1b19eb12" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_1305 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_1307 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_1305.isDisabled && - hook$jscomp$inline_1305.supportsFiber + !hook$jscomp$inline_1307.isDisabled && + hook$jscomp$inline_1307.supportsFiber ) try { - (rendererID = hook$jscomp$inline_1305.inject( - internals$jscomp$inline_1304 + (rendererID = hook$jscomp$inline_1307.inject( + internals$jscomp$inline_1306 )), - (injectedHook = hook$jscomp$inline_1305); + (injectedHook = hook$jscomp$inline_1307); } catch (err) {} } var Path = Mode$1.Path; diff --git a/compiled/facebook-www/ReactART-prod.modern.js b/compiled/facebook-www/ReactART-prod.modern.js index 24f698b819..2aa443cbf4 100644 --- a/compiled/facebook-www/ReactART-prod.modern.js +++ b/compiled/facebook-www/ReactART-prod.modern.js @@ -77,6 +77,8 @@ var ReactSharedInternals = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, REACT_ELEMENT_TYPE = Symbol.for("react.element"), REACT_PORTAL_TYPE = Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"), @@ -2940,6 +2942,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -3235,8 +3247,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -3353,10 +3366,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -9774,10 +9787,10 @@ var slice = Array.prototype.slice, return null; }, bundleType: 0, - version: "18.3.0-www-modern-f919825d", + version: "18.3.0-www-modern-f6e4fdbf", rendererPackageName: "react-art" }; -var internals$jscomp$inline_1284 = { +var internals$jscomp$inline_1286 = { bundleType: devToolsConfig$jscomp$inline_1111.bundleType, version: devToolsConfig$jscomp$inline_1111.version, rendererPackageName: devToolsConfig$jscomp$inline_1111.rendererPackageName, @@ -9805,19 +9818,19 @@ var internals$jscomp$inline_1284 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-f919825d" + reconcilerVersion: "18.3.0-www-modern-f6e4fdbf" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_1285 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_1287 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_1285.isDisabled && - hook$jscomp$inline_1285.supportsFiber + !hook$jscomp$inline_1287.isDisabled && + hook$jscomp$inline_1287.supportsFiber ) try { - (rendererID = hook$jscomp$inline_1285.inject( - internals$jscomp$inline_1284 + (rendererID = hook$jscomp$inline_1287.inject( + internals$jscomp$inline_1286 )), - (injectedHook = hook$jscomp$inline_1285); + (injectedHook = hook$jscomp$inline_1287); } catch (err) {} } var Path = Mode$1.Path; diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js index eff17cd6f1..10b4e150ef 100644 --- a/compiled/facebook-www/ReactDOM-dev.classic.js +++ b/compiled/facebook-www/ReactDOM-dev.classic.js @@ -147,7 +147,9 @@ var disableInputAttributeSyncing = enableDO_NOT_USE_disableStrictPassiveEffect = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = - dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop; // On WWW, false is used for a new modern build. + dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, false is used for a new modern build. var enableProfilerTimer = true; var enableProfilerCommitHooks = true; var enableProfilerNestedUpdatePhase = true; @@ -14287,26 +14289,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -14314,7 +14314,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (enableUseDeferredValueInitialArg && initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -15024,10 +15053,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15163,10 +15192,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15300,7 +15329,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -15439,10 +15468,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15594,11 +15623,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15755,7 +15784,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -15916,11 +15945,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -34007,7 +34036,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-classic-ccc48f7f"; +var ReactVersion = "18.3.0-www-classic-ba4a7e73"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js index 62a9831a58..98666c41e7 100644 --- a/compiled/facebook-www/ReactDOM-dev.modern.js +++ b/compiled/facebook-www/ReactDOM-dev.modern.js @@ -133,7 +133,9 @@ var disableInputAttributeSyncing = enableDO_NOT_USE_disableStrictPassiveEffect = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = - dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop; // On WWW, true is used for a new modern build. + dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, true is used for a new modern build. var enableProfilerTimer = true; var enableProfilerCommitHooks = true; var enableProfilerNestedUpdatePhase = true; @@ -14228,26 +14230,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -14255,7 +14255,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (enableUseDeferredValueInitialArg && initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -14965,10 +14994,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15104,10 +15133,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15241,7 +15270,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -15380,10 +15409,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15535,11 +15564,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15696,7 +15725,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -15857,11 +15886,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -33852,7 +33881,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-modern-c9ef3c38"; +var ReactVersion = "18.3.0-www-modern-c68162ba"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js index cfc97da38a..1b58319164 100644 --- a/compiled/facebook-www/ReactDOM-prod.classic.js +++ b/compiled/facebook-www/ReactDOM-prod.classic.js @@ -58,6 +58,8 @@ var ReactSharedInternals = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, REACT_ELEMENT_TYPE = Symbol.for("react.element"), REACT_PORTAL_TYPE = Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"), @@ -3874,6 +3876,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -4169,8 +4181,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -4317,10 +4330,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -16377,10 +16390,10 @@ Internals.Events = [ var devToolsConfig$jscomp$inline_1779 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-c9e82eec", + version: "18.3.0-www-classic-4be75e6a", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2123 = { +var internals$jscomp$inline_2125 = { bundleType: devToolsConfig$jscomp$inline_1779.bundleType, version: devToolsConfig$jscomp$inline_1779.version, rendererPackageName: devToolsConfig$jscomp$inline_1779.rendererPackageName, @@ -16407,19 +16420,19 @@ var internals$jscomp$inline_2123 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-c9e82eec" + reconcilerVersion: "18.3.0-www-classic-4be75e6a" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2124 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2126 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2124.isDisabled && - hook$jscomp$inline_2124.supportsFiber + !hook$jscomp$inline_2126.isDisabled && + hook$jscomp$inline_2126.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2124.inject( - internals$jscomp$inline_2123 + (rendererID = hook$jscomp$inline_2126.inject( + internals$jscomp$inline_2125 )), - (injectedHook = hook$jscomp$inline_2124); + (injectedHook = hook$jscomp$inline_2126); } catch (err) {} } assign(Internals, { @@ -16744,4 +16757,4 @@ exports.useFormState = function () { exports.useFormStatus = function () { throw Error(formatProdErrorMessage(248)); }; -exports.version = "18.3.0-www-classic-c9e82eec"; +exports.version = "18.3.0-www-classic-4be75e6a"; diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js index 9036d08e0d..d6d8cd2447 100644 --- a/compiled/facebook-www/ReactDOM-prod.modern.js +++ b/compiled/facebook-www/ReactDOM-prod.modern.js @@ -61,6 +61,8 @@ var assign = Object.assign, dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, valueStack = [], @@ -3767,6 +3769,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -4062,8 +4074,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -4210,10 +4223,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -15899,10 +15912,10 @@ Internals.Events = [ var devToolsConfig$jscomp$inline_1738 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-012c009e", + version: "18.3.0-www-modern-81ff1bb4", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2087 = { +var internals$jscomp$inline_2089 = { bundleType: devToolsConfig$jscomp$inline_1738.bundleType, version: devToolsConfig$jscomp$inline_1738.version, rendererPackageName: devToolsConfig$jscomp$inline_1738.rendererPackageName, @@ -15930,19 +15943,19 @@ var internals$jscomp$inline_2087 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-012c009e" + reconcilerVersion: "18.3.0-www-modern-81ff1bb4" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2088 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2090 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2088.isDisabled && - hook$jscomp$inline_2088.supportsFiber + !hook$jscomp$inline_2090.isDisabled && + hook$jscomp$inline_2090.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2088.inject( - internals$jscomp$inline_2087 + (rendererID = hook$jscomp$inline_2090.inject( + internals$jscomp$inline_2089 )), - (injectedHook = hook$jscomp$inline_2088); + (injectedHook = hook$jscomp$inline_2090); } catch (err) {} } exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; @@ -16195,4 +16208,4 @@ exports.useFormState = function () { exports.useFormStatus = function () { throw Error(formatProdErrorMessage(248)); }; -exports.version = "18.3.0-www-modern-012c009e"; +exports.version = "18.3.0-www-modern-81ff1bb4"; diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js index 57e9fe63c0..459d9fd45c 100644 --- a/compiled/facebook-www/ReactDOM-profiling.classic.js +++ b/compiled/facebook-www/ReactDOM-profiling.classic.js @@ -69,6 +69,8 @@ var ReactSharedInternals = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, enableProfilerNestedUpdateScheduledHook = dynamicFeatureFlags.enableProfilerNestedUpdateScheduledHook, enableSchedulingProfiler = dynamicFeatureFlags.enableSchedulingProfiler, @@ -4020,6 +4022,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -4318,8 +4330,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -4466,10 +4479,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -17152,7 +17165,7 @@ Internals.Events = [ var devToolsConfig$jscomp$inline_1864 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-d075b082", + version: "18.3.0-www-classic-ff5a1ccf", rendererPackageName: "react-dom" }; (function (internals) { @@ -17196,7 +17209,7 @@ var devToolsConfig$jscomp$inline_1864 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-d075b082" + reconcilerVersion: "18.3.0-www-classic-ff5a1ccf" }); assign(Internals, { ReactBrowserEventEmitter: { @@ -17520,7 +17533,7 @@ exports.useFormState = function () { exports.useFormStatus = function () { throw Error(formatProdErrorMessage(248)); }; -exports.version = "18.3.0-www-classic-d075b082"; +exports.version = "18.3.0-www-classic-ff5a1ccf"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/ReactDOM-profiling.modern.js b/compiled/facebook-www/ReactDOM-profiling.modern.js index c111df4d75..de6ef958a6 100644 --- a/compiled/facebook-www/ReactDOM-profiling.modern.js +++ b/compiled/facebook-www/ReactDOM-profiling.modern.js @@ -72,6 +72,8 @@ var assign = Object.assign, dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, enableProfilerNestedUpdateScheduledHook = dynamicFeatureFlags.enableProfilerNestedUpdateScheduledHook, enableSchedulingProfiler = dynamicFeatureFlags.enableSchedulingProfiler, @@ -3913,6 +3915,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -4211,8 +4223,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -4359,10 +4372,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -16668,7 +16681,7 @@ Internals.Events = [ var devToolsConfig$jscomp$inline_1823 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-b2fdc00b", + version: "18.3.0-www-modern-0262bd01", rendererPackageName: "react-dom" }; (function (internals) { @@ -16713,7 +16726,7 @@ var devToolsConfig$jscomp$inline_1823 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-b2fdc00b" + reconcilerVersion: "18.3.0-www-modern-0262bd01" }); exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; exports.createPortal = function (children, container) { @@ -16965,7 +16978,7 @@ exports.useFormState = function () { exports.useFormStatus = function () { throw Error(formatProdErrorMessage(248)); }; -exports.version = "18.3.0-www-modern-b2fdc00b"; +exports.version = "18.3.0-www-modern-0262bd01"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/ReactDOMServer-dev.classic.js b/compiled/facebook-www/ReactDOMServer-dev.classic.js index dfc1bd4622..9b3254fc04 100644 --- a/compiled/facebook-www/ReactDOMServer-dev.classic.js +++ b/compiled/facebook-www/ReactDOMServer-dev.classic.js @@ -19,7 +19,7 @@ if (__DEV__) { var React = require("react"); var ReactDOM = require("react-dom"); -var ReactVersion = "18.3.0-www-classic-6d747e3d"; +var ReactVersion = "18.3.0-www-classic-f6b9b0ac"; // This refers to a WWW module. var warningWWW = require("warning"); @@ -329,8 +329,9 @@ var dynamicFeatureFlags = require("ReactFeatureFlags"); var enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing, enableCustomElementPropertySupport = dynamicFeatureFlags.enableCustomElementPropertySupport, - enableAsyncActions = dynamicFeatureFlags.enableAsyncActions; -// On WWW, false is used for a new modern build. + enableAsyncActions = dynamicFeatureFlags.enableAsyncActions, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, false is used for a new modern build. var enableFloat = true; // $FlowFixMe[method-unbinding] @@ -9671,9 +9672,14 @@ function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) { return getServerSnapshot(); } -function useDeferredValue(value) { +function useDeferredValue(value, initialValue) { resolveCurrentlyRenderingComponent(); - return value; + + if (enableUseDeferredValueInitialArg) { + return initialValue !== undefined ? initialValue : value; + } else { + return value; + } } function unsupportedStartTransition() { diff --git a/compiled/facebook-www/ReactDOMServer-dev.modern.js b/compiled/facebook-www/ReactDOMServer-dev.modern.js index 48f1880860..33e0a9c1c7 100644 --- a/compiled/facebook-www/ReactDOMServer-dev.modern.js +++ b/compiled/facebook-www/ReactDOMServer-dev.modern.js @@ -19,7 +19,7 @@ if (__DEV__) { var React = require("react"); var ReactDOM = require("react-dom"); -var ReactVersion = "18.3.0-www-modern-612d960e"; +var ReactVersion = "18.3.0-www-modern-7ef93208"; // This refers to a WWW module. var warningWWW = require("warning"); @@ -329,8 +329,9 @@ var dynamicFeatureFlags = require("ReactFeatureFlags"); var enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing, enableCustomElementPropertySupport = dynamicFeatureFlags.enableCustomElementPropertySupport, - enableAsyncActions = dynamicFeatureFlags.enableAsyncActions; -// On WWW, true is used for a new modern build. + enableAsyncActions = dynamicFeatureFlags.enableAsyncActions, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, true is used for a new modern build. var enableFloat = true; // $FlowFixMe[method-unbinding] @@ -9430,9 +9431,14 @@ function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) { return getServerSnapshot(); } -function useDeferredValue(value) { +function useDeferredValue(value, initialValue) { resolveCurrentlyRenderingComponent(); - return value; + + if (enableUseDeferredValueInitialArg) { + return initialValue !== undefined ? initialValue : value; + } else { + return value; + } } function unsupportedStartTransition() { diff --git a/compiled/facebook-www/ReactDOMServer-prod.classic.js b/compiled/facebook-www/ReactDOMServer-prod.classic.js index c1857f7897..d3938761aa 100644 --- a/compiled/facebook-www/ReactDOMServer-prod.classic.js +++ b/compiled/facebook-www/ReactDOMServer-prod.classic.js @@ -112,6 +112,8 @@ var assign = Object.assign, enableCustomElementPropertySupport = dynamicFeatureFlags.enableCustomElementPropertySupport, enableAsyncActions = dynamicFeatureFlags.enableAsyncActions, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, hasOwnProperty = Object.prototype.hasOwnProperty, VALID_ATTRIBUTE_NAME_REGEX = RegExp( "^[:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD][:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040]*$" @@ -2860,9 +2862,13 @@ var HooksDispatcher = { useImperativeHandle: noop$1, useEffect: noop$1, useDebugValue: noop$1, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { resolveCurrentlyRenderingComponent(); - return value; + return enableUseDeferredValueInitialArg + ? void 0 !== initialValue + ? initialValue + : value + : value; }, useTransition: function () { resolveCurrentlyRenderingComponent(); @@ -5048,4 +5054,4 @@ exports.renderToString = function (children, options) { 'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server' ); }; -exports.version = "18.3.0-www-classic-a436c803"; +exports.version = "18.3.0-www-classic-6617a9c8"; diff --git a/compiled/facebook-www/ReactDOMServer-prod.modern.js b/compiled/facebook-www/ReactDOMServer-prod.modern.js index 7cd4b61a71..19afff259a 100644 --- a/compiled/facebook-www/ReactDOMServer-prod.modern.js +++ b/compiled/facebook-www/ReactDOMServer-prod.modern.js @@ -112,6 +112,8 @@ var assign = Object.assign, enableCustomElementPropertySupport = dynamicFeatureFlags.enableCustomElementPropertySupport, enableAsyncActions = dynamicFeatureFlags.enableAsyncActions, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, hasOwnProperty = Object.prototype.hasOwnProperty, VALID_ATTRIBUTE_NAME_REGEX = RegExp( "^[:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD][:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040]*$" @@ -2852,9 +2854,13 @@ var HooksDispatcher = { useImperativeHandle: noop$1, useEffect: noop$1, useDebugValue: noop$1, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { resolveCurrentlyRenderingComponent(); - return value; + return enableUseDeferredValueInitialArg + ? void 0 !== initialValue + ? initialValue + : value + : value; }, useTransition: function () { resolveCurrentlyRenderingComponent(); @@ -4983,4 +4989,4 @@ exports.renderToString = function (children, options) { 'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server' ); }; -exports.version = "18.3.0-www-modern-f919825d"; +exports.version = "18.3.0-www-modern-f6e4fdbf"; diff --git a/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js b/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js index ca49f8d189..87b1e5975d 100644 --- a/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js +++ b/compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js @@ -326,8 +326,9 @@ var dynamicFeatureFlags = require("ReactFeatureFlags"); var enableTransitionTracing = dynamicFeatureFlags.enableTransitionTracing, enableCustomElementPropertySupport = dynamicFeatureFlags.enableCustomElementPropertySupport, - enableAsyncActions = dynamicFeatureFlags.enableAsyncActions; -// On WWW, true is used for a new modern build. + enableAsyncActions = dynamicFeatureFlags.enableAsyncActions, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, true is used for a new modern build. var enableFloat = true; // $FlowFixMe[method-unbinding] @@ -9317,9 +9318,14 @@ function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) { return getServerSnapshot(); } -function useDeferredValue(value) { +function useDeferredValue(value, initialValue) { resolveCurrentlyRenderingComponent(); - return value; + + if (enableUseDeferredValueInitialArg) { + return initialValue !== undefined ? initialValue : value; + } else { + return value; + } } function unsupportedStartTransition() { diff --git a/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js b/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js index c110d80231..261359ec32 100644 --- a/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js +++ b/compiled/facebook-www/ReactDOMServerStreaming-prod.modern.js @@ -103,6 +103,8 @@ var assign = Object.assign, enableCustomElementPropertySupport = dynamicFeatureFlags.enableCustomElementPropertySupport, enableAsyncActions = dynamicFeatureFlags.enableAsyncActions, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, hasOwnProperty = Object.prototype.hasOwnProperty, VALID_ATTRIBUTE_NAME_REGEX = RegExp( "^[:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD][:A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040]*$" @@ -2851,9 +2853,13 @@ var HooksDispatcher = { useImperativeHandle: noop$1, useEffect: noop$1, useDebugValue: noop$1, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { resolveCurrentlyRenderingComponent(); - return value; + return enableUseDeferredValueInitialArg + ? void 0 !== initialValue + ? initialValue + : value + : value; }, useTransition: function () { resolveCurrentlyRenderingComponent(); diff --git a/compiled/facebook-www/ReactDOMTesting-dev.classic.js b/compiled/facebook-www/ReactDOMTesting-dev.classic.js index 7d1dccce78..2fc993f792 100644 --- a/compiled/facebook-www/ReactDOMTesting-dev.classic.js +++ b/compiled/facebook-www/ReactDOMTesting-dev.classic.js @@ -136,7 +136,9 @@ var disableInputAttributeSyncing = enableDO_NOT_USE_disableStrictPassiveEffect = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = - dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop; // On WWW, false is used for a new modern build. + dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, false is used for a new modern build. var enableProfilerTimer = true; var enableProfilerCommitHooks = true; var enableProfilerNestedUpdatePhase = true; @@ -14421,26 +14423,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -14448,7 +14448,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (enableUseDeferredValueInitialArg && initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -15158,10 +15187,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15297,10 +15326,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15434,7 +15463,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -15573,10 +15602,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15728,11 +15757,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15889,7 +15918,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -16050,11 +16079,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -34624,7 +34653,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-classic-a4f03e3d"; +var ReactVersion = "18.3.0-www-classic-8ec75daf"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOMTesting-dev.modern.js b/compiled/facebook-www/ReactDOMTesting-dev.modern.js index 8efbcc65ac..b67d3ba19b 100644 --- a/compiled/facebook-www/ReactDOMTesting-dev.modern.js +++ b/compiled/facebook-www/ReactDOMTesting-dev.modern.js @@ -122,7 +122,9 @@ var disableInputAttributeSyncing = enableDO_NOT_USE_disableStrictPassiveEffect = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = - dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop; // On WWW, true is used for a new modern build. + dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg; // On WWW, true is used for a new modern build. var enableProfilerTimer = true; var enableProfilerCommitHooks = true; var enableProfilerNestedUpdatePhase = true; @@ -14362,26 +14364,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -14389,7 +14389,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (enableUseDeferredValueInitialArg && initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -15099,10 +15128,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15238,10 +15267,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15375,7 +15404,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -15514,10 +15543,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15669,11 +15698,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -15830,7 +15859,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -15991,11 +16020,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -34469,7 +34498,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-modern-20e3e48a"; +var ReactVersion = "18.3.0-www-modern-1eaea04e"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOMTesting-prod.classic.js b/compiled/facebook-www/ReactDOMTesting-prod.classic.js index ae11327bc0..7a0fca2b7f 100644 --- a/compiled/facebook-www/ReactDOMTesting-prod.classic.js +++ b/compiled/facebook-www/ReactDOMTesting-prod.classic.js @@ -58,6 +58,8 @@ var ReactSharedInternals = dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, REACT_ELEMENT_TYPE = Symbol.for("react.element"), REACT_PORTAL_TYPE = Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"), @@ -3960,6 +3962,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -4255,8 +4267,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -4403,10 +4416,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -16706,10 +16719,10 @@ Internals.Events = [ var devToolsConfig$jscomp$inline_1808 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-f4ae0982", + version: "18.3.0-www-classic-5bedd128", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2157 = { +var internals$jscomp$inline_2159 = { bundleType: devToolsConfig$jscomp$inline_1808.bundleType, version: devToolsConfig$jscomp$inline_1808.version, rendererPackageName: devToolsConfig$jscomp$inline_1808.rendererPackageName, @@ -16736,19 +16749,19 @@ var internals$jscomp$inline_2157 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-f4ae0982" + reconcilerVersion: "18.3.0-www-classic-5bedd128" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2158 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2160 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2158.isDisabled && - hook$jscomp$inline_2158.supportsFiber + !hook$jscomp$inline_2160.isDisabled && + hook$jscomp$inline_2160.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2158.inject( - internals$jscomp$inline_2157 + (rendererID = hook$jscomp$inline_2160.inject( + internals$jscomp$inline_2159 )), - (injectedHook = hook$jscomp$inline_2158); + (injectedHook = hook$jscomp$inline_2160); } catch (err) {} } assign(Internals, { @@ -17224,4 +17237,4 @@ exports.useFormState = function () { exports.useFormStatus = function () { throw Error(formatProdErrorMessage(248)); }; -exports.version = "18.3.0-www-classic-f4ae0982"; +exports.version = "18.3.0-www-classic-5bedd128"; diff --git a/compiled/facebook-www/ReactDOMTesting-prod.modern.js b/compiled/facebook-www/ReactDOMTesting-prod.modern.js index 207727e02a..7082b9f2c6 100644 --- a/compiled/facebook-www/ReactDOMTesting-prod.modern.js +++ b/compiled/facebook-www/ReactDOMTesting-prod.modern.js @@ -61,6 +61,8 @@ var assign = Object.assign, dynamicFeatureFlags.enableDO_NOT_USE_disableStrictPassiveEffect, disableSchedulerTimeoutInWorkLoop = dynamicFeatureFlags.disableSchedulerTimeoutInWorkLoop, + enableUseDeferredValueInitialArg = + dynamicFeatureFlags.enableUseDeferredValueInitialArg, ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, valueStack = [], @@ -3908,6 +3910,16 @@ function updateMemo(nextCreate, deps) { hook.memoizedState = [nextCreate, deps]; return nextCreate; } +function mountDeferredValueImpl(hook, value, initialValue) { + return enableUseDeferredValueInitialArg && void 0 !== initialValue + ? ((hook.memoizedState = initialValue), + (value = claimNextTransitionLane()), + (currentlyRenderingFiber$1.lanes |= value), + (workInProgressRootSkippedLanes |= value), + (hook.baseState = !0), + initialValue) + : (hook.memoizedState = value); +} function updateDeferredValueImpl(hook, prevValue, value) { if (0 === (renderLanes$1 & 42)) return ( @@ -4203,8 +4215,9 @@ var HooksDispatcherOnMount = { return [initialState.memoizedState, dispatch]; }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { - return (mountWorkInProgressHook().memoizedState = value); + useDeferredValue: function (value, initialValue) { + var hook = mountWorkInProgressHook(); + return mountDeferredValueImpl(hook, value, initialValue); }, useTransition: function () { var stateHook = mountStateImpl(!1); @@ -4351,10 +4364,10 @@ var HooksDispatcherOnRerender = { return rerenderReducer(basicStateReducer); }, useDebugValue: mountDebugValue, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { var hook = updateWorkInProgressHook(); return null === currentHook - ? (hook.memoizedState = value) + ? mountDeferredValueImpl(hook, value, initialValue) : updateDeferredValueImpl(hook, currentHook.memoizedState, value); }, useTransition: function () { @@ -16283,10 +16296,10 @@ Internals.Events = [ var devToolsConfig$jscomp$inline_1767 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-b51738eb", + version: "18.3.0-www-modern-316f00ed", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2121 = { +var internals$jscomp$inline_2123 = { bundleType: devToolsConfig$jscomp$inline_1767.bundleType, version: devToolsConfig$jscomp$inline_1767.version, rendererPackageName: devToolsConfig$jscomp$inline_1767.rendererPackageName, @@ -16314,19 +16327,19 @@ var internals$jscomp$inline_2121 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-b51738eb" + reconcilerVersion: "18.3.0-www-modern-316f00ed" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2122 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2124 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2122.isDisabled && - hook$jscomp$inline_2122.supportsFiber + !hook$jscomp$inline_2124.isDisabled && + hook$jscomp$inline_2124.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2122.inject( - internals$jscomp$inline_2121 + (rendererID = hook$jscomp$inline_2124.inject( + internals$jscomp$inline_2123 )), - (injectedHook = hook$jscomp$inline_2122); + (injectedHook = hook$jscomp$inline_2124); } catch (err) {} } exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; @@ -16730,4 +16743,4 @@ exports.useFormState = function () { exports.useFormStatus = function () { throw Error(formatProdErrorMessage(248)); }; -exports.version = "18.3.0-www-modern-b51738eb"; +exports.version = "18.3.0-www-modern-316f00ed"; diff --git a/compiled/facebook-www/ReactTestRenderer-dev.classic.js b/compiled/facebook-www/ReactTestRenderer-dev.classic.js index c1782b8b41..3b42cce214 100644 --- a/compiled/facebook-www/ReactTestRenderer-dev.classic.js +++ b/compiled/facebook-www/ReactTestRenderer-dev.classic.js @@ -8776,26 +8776,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -8803,7 +8801,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -9461,10 +9488,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -9601,10 +9628,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -9737,7 +9764,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -9877,10 +9904,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10033,11 +10060,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10190,7 +10217,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -10347,11 +10374,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -25135,7 +25162,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-classic-b08870f0"; +var ReactVersion = "18.3.0-www-classic-20c4b7b9"; // Might add PROFILE later. diff --git a/compiled/facebook-www/ReactTestRenderer-dev.modern.js b/compiled/facebook-www/ReactTestRenderer-dev.modern.js index 5bd63f597e..41776a8f7c 100644 --- a/compiled/facebook-www/ReactTestRenderer-dev.modern.js +++ b/compiled/facebook-www/ReactTestRenderer-dev.modern.js @@ -8776,26 +8776,24 @@ function updateMemo(nextCreate, deps) { return nextValue; } -function mountDeferredValue(value) { +function mountDeferredValue(value, initialValue) { var hook = mountWorkInProgressHook(); - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } -function updateDeferredValue(value) { +function updateDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); var resolvedCurrentHook = currentHook; var prevValue = resolvedCurrentHook.memoizedState; return updateDeferredValueImpl(hook, prevValue, value); } -function rerenderDeferredValue(value) { +function rerenderDeferredValue(value, initialValue) { var hook = updateWorkInProgressHook(); if (currentHook === null) { // This is a rerender during a mount. - hook.memoizedState = value; - return value; + return mountDeferredValueImpl(hook, value, initialValue); } else { // This is a rerender during an update. var prevValue = currentHook.memoizedState; @@ -8803,7 +8801,36 @@ function rerenderDeferredValue(value) { } } -function updateDeferredValueImpl(hook, prevValue, value) { +function mountDeferredValueImpl(hook, value, initialValue) { + if (initialValue !== undefined) { + // When `initialValue` is provided, we defer the initial render even if the + // current render is not synchronous. + // TODO: However, to avoid waterfalls, we should not defer if this render + // was itself spawned by an earlier useDeferredValue. Plan is to add a + // Deferred lane to track this. + hook.memoizedState = initialValue; // Schedule a deferred render + + var deferredLane = claimNextTransitionLane(); + currentlyRenderingFiber$1.lanes = mergeLanes( + currentlyRenderingFiber$1.lanes, + deferredLane + ); + markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent + // from the latest value. The name "baseState" doesn't really match how we + // use it because we're reusing a state hook field instead of creating a + // new one. + + hook.baseState = true; + return initialValue; + } else { + hook.memoizedState = value; + return value; + } +} + +function updateDeferredValueImpl(hook, prevValue, value, initialValue) { + // TODO: We should also check if this component is going from + // hidden -> visible. If so, it should use the initialValue arg. var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes$1); if (shouldDeferValue) { @@ -9461,10 +9488,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -9601,10 +9628,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -9737,7 +9764,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); return updateDeferredValue(value); @@ -9877,10 +9904,10 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10033,11 +10060,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; mountHookTypesDev(); return mountDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); mountHookTypesDev(); - return mountDeferredValue(value); + return mountDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -10190,7 +10217,7 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); @@ -10347,11 +10374,11 @@ var InvalidNestedHooksDispatcherOnRerenderInDEV = null; updateHookTypesDev(); return updateDebugValue(); }, - useDeferredValue: function (value) { + useDeferredValue: function (value, initialValue) { currentHookNameInDev = "useDeferredValue"; warnInvalidHookAccess(); updateHookTypesDev(); - return rerenderDeferredValue(value); + return rerenderDeferredValue(value, initialValue); }, useTransition: function () { currentHookNameInDev = "useTransition"; @@ -25135,7 +25162,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-modern-14703ddb"; +var ReactVersion = "18.3.0-www-modern-2e5162a7"; // Might add PROFILE later.