144 lines
9.4 KiB
JavaScript
144 lines
9.4 KiB
JavaScript
import $670gB$react, {useContext as $670gB$useContext, useState as $670gB$useState, useMemo as $670gB$useMemo, useLayoutEffect as $670gB$useLayoutEffect, useRef as $670gB$useRef} from "react";
|
|
|
|
/*
|
|
* Copyright 2020 Adobe. All rights reserved.
|
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
* governing permissions and limitations under the License.
|
|
*/ // We must avoid a circular dependency with @react-aria/utils, and this useLayoutEffect is
|
|
// guarded by a check that it only runs on the client side.
|
|
// eslint-disable-next-line rulesdir/useLayoutEffectRule
|
|
|
|
// Default context value to use in case there is no SSRProvider. This is fine for
|
|
// client-only apps. In order to support multiple copies of React Aria potentially
|
|
// being on the page at once, the prefix is set to a random number. SSRProvider
|
|
// will reset this to zero for consistency between server and client, so in the
|
|
// SSR case multiple copies of React Aria is not supported.
|
|
const $b5e257d569688ac6$var$defaultContext = {
|
|
prefix: String(Math.round(Math.random() * 10000000000)),
|
|
current: 0
|
|
};
|
|
const $b5e257d569688ac6$var$SSRContext = /*#__PURE__*/ (0, $670gB$react).createContext($b5e257d569688ac6$var$defaultContext);
|
|
const $b5e257d569688ac6$var$IsSSRContext = /*#__PURE__*/ (0, $670gB$react).createContext(false);
|
|
// This is only used in React < 18.
|
|
function $b5e257d569688ac6$var$LegacySSRProvider(props) {
|
|
let cur = (0, $670gB$useContext)($b5e257d569688ac6$var$SSRContext);
|
|
let counter = $b5e257d569688ac6$var$useCounter(cur === $b5e257d569688ac6$var$defaultContext);
|
|
let [isSSR, setIsSSR] = (0, $670gB$useState)(true);
|
|
let value = (0, $670gB$useMemo)(()=>({
|
|
// If this is the first SSRProvider, start with an empty string prefix, otherwise
|
|
// append and increment the counter.
|
|
prefix: cur === $b5e257d569688ac6$var$defaultContext ? '' : `${cur.prefix}-${counter}`,
|
|
current: 0
|
|
}), [
|
|
cur,
|
|
counter
|
|
]);
|
|
// If on the client, and the component was initially server rendered,
|
|
// then schedule a layout effect to update the component after hydration.
|
|
if (typeof document !== 'undefined') // This if statement technically breaks the rules of hooks, but is safe
|
|
// because the condition never changes after mounting.
|
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
(0, $670gB$useLayoutEffect)(()=>{
|
|
setIsSSR(false);
|
|
}, []);
|
|
return /*#__PURE__*/ (0, $670gB$react).createElement($b5e257d569688ac6$var$SSRContext.Provider, {
|
|
value: value
|
|
}, /*#__PURE__*/ (0, $670gB$react).createElement($b5e257d569688ac6$var$IsSSRContext.Provider, {
|
|
value: isSSR
|
|
}, props.children));
|
|
}
|
|
let $b5e257d569688ac6$var$warnedAboutSSRProvider = false;
|
|
function $b5e257d569688ac6$export$9f8ac96af4b1b2ae(props) {
|
|
if (typeof (0, $670gB$react)['useId'] === 'function') {
|
|
if (process.env.NODE_ENV !== 'test' && process.env.NODE_ENV !== 'production' && !$b5e257d569688ac6$var$warnedAboutSSRProvider) {
|
|
console.warn('In React 18, SSRProvider is not necessary and is a noop. You can remove it from your app.');
|
|
$b5e257d569688ac6$var$warnedAboutSSRProvider = true;
|
|
}
|
|
return /*#__PURE__*/ (0, $670gB$react).createElement((0, $670gB$react).Fragment, null, props.children);
|
|
}
|
|
return /*#__PURE__*/ (0, $670gB$react).createElement($b5e257d569688ac6$var$LegacySSRProvider, props);
|
|
}
|
|
let $b5e257d569688ac6$var$canUseDOM = Boolean(typeof window !== 'undefined' && window.document && window.document.createElement);
|
|
let $b5e257d569688ac6$var$componentIds = new WeakMap();
|
|
function $b5e257d569688ac6$var$useCounter(isDisabled = false) {
|
|
let ctx = (0, $670gB$useContext)($b5e257d569688ac6$var$SSRContext);
|
|
let ref = (0, $670gB$useRef)(null);
|
|
// eslint-disable-next-line rulesdir/pure-render
|
|
if (ref.current === null && !isDisabled) {
|
|
var _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner, _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
// In strict mode, React renders components twice, and the ref will be reset to null on the second render.
|
|
// This means our id counter will be incremented twice instead of once. This is a problem because on the
|
|
// server, components are only rendered once and so ids generated on the server won't match the client.
|
|
// In React 18, useId was introduced to solve this, but it is not available in older versions. So to solve this
|
|
// we need to use some React internals to access the underlying Fiber instance, which is stable between renders.
|
|
// This is exposed as ReactCurrentOwner in development, which is all we need since StrictMode only runs in development.
|
|
// To ensure that we only increment the global counter once, we store the starting id for this component in
|
|
// a weak map associated with the Fiber. On the second render, we reset the global counter to this value.
|
|
// Since React runs the second render immediately after the first, this is safe.
|
|
// @ts-ignore
|
|
let currentOwner = (_React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = (0, $670gB$react).__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED) === null || _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED === void 0 ? void 0 : (_React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner = _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner) === null || _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner === void 0 ? void 0 : _React___SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED_ReactCurrentOwner.current;
|
|
if (currentOwner) {
|
|
let prevComponentValue = $b5e257d569688ac6$var$componentIds.get(currentOwner);
|
|
if (prevComponentValue == null) // On the first render, and first call to useId, store the id and state in our weak map.
|
|
$b5e257d569688ac6$var$componentIds.set(currentOwner, {
|
|
id: ctx.current,
|
|
state: currentOwner.memoizedState
|
|
});
|
|
else if (currentOwner.memoizedState !== prevComponentValue.state) {
|
|
// On the second render, the memoizedState gets reset by React.
|
|
// Reset the counter, and remove from the weak map so we don't
|
|
// do this for subsequent useId calls.
|
|
ctx.current = prevComponentValue.id;
|
|
$b5e257d569688ac6$var$componentIds.delete(currentOwner);
|
|
}
|
|
}
|
|
// eslint-disable-next-line rulesdir/pure-render
|
|
ref.current = ++ctx.current;
|
|
}
|
|
// eslint-disable-next-line rulesdir/pure-render
|
|
return ref.current;
|
|
}
|
|
function $b5e257d569688ac6$var$useLegacySSRSafeId(defaultId) {
|
|
let ctx = (0, $670gB$useContext)($b5e257d569688ac6$var$SSRContext);
|
|
// If we are rendering in a non-DOM environment, and there's no SSRProvider,
|
|
// provide a warning to hint to the developer to add one.
|
|
if (ctx === $b5e257d569688ac6$var$defaultContext && !$b5e257d569688ac6$var$canUseDOM && process.env.NODE_ENV !== 'production') console.warn('When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are generated between the client and server.');
|
|
let counter = $b5e257d569688ac6$var$useCounter(!!defaultId);
|
|
let prefix = ctx === $b5e257d569688ac6$var$defaultContext && process.env.NODE_ENV === 'test' ? 'react-aria' : `react-aria${ctx.prefix}`;
|
|
return defaultId || `${prefix}-${counter}`;
|
|
}
|
|
function $b5e257d569688ac6$var$useModernSSRSafeId(defaultId) {
|
|
let id = (0, $670gB$react).useId();
|
|
let [didSSR] = (0, $670gB$useState)($b5e257d569688ac6$export$535bd6ca7f90a273());
|
|
let prefix = didSSR || process.env.NODE_ENV === 'test' ? 'react-aria' : `react-aria${$b5e257d569688ac6$var$defaultContext.prefix}`;
|
|
return defaultId || `${prefix}-${id}`;
|
|
}
|
|
const $b5e257d569688ac6$export$619500959fc48b26 = typeof (0, $670gB$react)['useId'] === 'function' ? $b5e257d569688ac6$var$useModernSSRSafeId : $b5e257d569688ac6$var$useLegacySSRSafeId;
|
|
function $b5e257d569688ac6$var$getSnapshot() {
|
|
return false;
|
|
}
|
|
function $b5e257d569688ac6$var$getServerSnapshot() {
|
|
return true;
|
|
}
|
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
function $b5e257d569688ac6$var$subscribe(onStoreChange) {
|
|
// noop
|
|
return ()=>{};
|
|
}
|
|
function $b5e257d569688ac6$export$535bd6ca7f90a273() {
|
|
// In React 18, we can use useSyncExternalStore to detect if we're server rendering or hydrating.
|
|
if (typeof (0, $670gB$react)['useSyncExternalStore'] === 'function') return (0, $670gB$react)['useSyncExternalStore']($b5e257d569688ac6$var$subscribe, $b5e257d569688ac6$var$getSnapshot, $b5e257d569688ac6$var$getServerSnapshot);
|
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
return (0, $670gB$useContext)($b5e257d569688ac6$var$IsSSRContext);
|
|
}
|
|
|
|
|
|
export {$b5e257d569688ac6$export$9f8ac96af4b1b2ae as SSRProvider, $b5e257d569688ac6$export$535bd6ca7f90a273 as useIsSSR, $b5e257d569688ac6$export$619500959fc48b26 as useSSRSafeId};
|
|
//# sourceMappingURL=SSRProvider.module.js.map
|