[d24f17c] | 1 | /**
|
---|
| 2 | * @license React
|
---|
| 3 | * use-sync-external-store-shim/with-selector.development.js
|
---|
| 4 | *
|
---|
| 5 | * Copyright (c) Facebook, Inc. and its affiliates.
|
---|
| 6 | *
|
---|
| 7 | * This source code is licensed under the MIT license found in the
|
---|
| 8 | * LICENSE file in the root directory of this source tree.
|
---|
| 9 | */
|
---|
| 10 |
|
---|
| 11 | 'use strict';
|
---|
| 12 |
|
---|
| 13 | if (process.env.NODE_ENV !== "production") {
|
---|
| 14 | (function() {
|
---|
| 15 |
|
---|
| 16 | 'use strict';
|
---|
| 17 |
|
---|
| 18 | /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
---|
| 19 | if (
|
---|
| 20 | typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
---|
| 21 | typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart ===
|
---|
| 22 | 'function'
|
---|
| 23 | ) {
|
---|
| 24 | __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
|
---|
| 25 | }
|
---|
| 26 | var React = require('react');
|
---|
| 27 | var shim = require('use-sync-external-store/shim');
|
---|
| 28 |
|
---|
| 29 | /**
|
---|
| 30 | * inlined Object.is polyfill to avoid requiring consumers ship their own
|
---|
| 31 | * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
|
---|
| 32 | */
|
---|
| 33 | function is(x, y) {
|
---|
| 34 | return x === y && (x !== 0 || 1 / x === 1 / y) || x !== x && y !== y // eslint-disable-line no-self-compare
|
---|
| 35 | ;
|
---|
| 36 | }
|
---|
| 37 |
|
---|
| 38 | var objectIs = typeof Object.is === 'function' ? Object.is : is;
|
---|
| 39 |
|
---|
| 40 | var useSyncExternalStore = shim.useSyncExternalStore;
|
---|
| 41 |
|
---|
| 42 | // for CommonJS interop.
|
---|
| 43 |
|
---|
| 44 | var useRef = React.useRef,
|
---|
| 45 | useEffect = React.useEffect,
|
---|
| 46 | useMemo = React.useMemo,
|
---|
| 47 | useDebugValue = React.useDebugValue; // Same as useSyncExternalStore, but supports selector and isEqual arguments.
|
---|
| 48 |
|
---|
| 49 | function useSyncExternalStoreWithSelector(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
|
---|
| 50 | // Use this to track the rendered snapshot.
|
---|
| 51 | var instRef = useRef(null);
|
---|
| 52 | var inst;
|
---|
| 53 |
|
---|
| 54 | if (instRef.current === null) {
|
---|
| 55 | inst = {
|
---|
| 56 | hasValue: false,
|
---|
| 57 | value: null
|
---|
| 58 | };
|
---|
| 59 | instRef.current = inst;
|
---|
| 60 | } else {
|
---|
| 61 | inst = instRef.current;
|
---|
| 62 | }
|
---|
| 63 |
|
---|
| 64 | var _useMemo = useMemo(function () {
|
---|
| 65 | // Track the memoized state using closure variables that are local to this
|
---|
| 66 | // memoized instance of a getSnapshot function. Intentionally not using a
|
---|
| 67 | // useRef hook, because that state would be shared across all concurrent
|
---|
| 68 | // copies of the hook/component.
|
---|
| 69 | var hasMemo = false;
|
---|
| 70 | var memoizedSnapshot;
|
---|
| 71 | var memoizedSelection;
|
---|
| 72 |
|
---|
| 73 | var memoizedSelector = function (nextSnapshot) {
|
---|
| 74 | if (!hasMemo) {
|
---|
| 75 | // The first time the hook is called, there is no memoized result.
|
---|
| 76 | hasMemo = true;
|
---|
| 77 | memoizedSnapshot = nextSnapshot;
|
---|
| 78 |
|
---|
| 79 | var _nextSelection = selector(nextSnapshot);
|
---|
| 80 |
|
---|
| 81 | if (isEqual !== undefined) {
|
---|
| 82 | // Even if the selector has changed, the currently rendered selection
|
---|
| 83 | // may be equal to the new selection. We should attempt to reuse the
|
---|
| 84 | // current value if possible, to preserve downstream memoizations.
|
---|
| 85 | if (inst.hasValue) {
|
---|
| 86 | var currentSelection = inst.value;
|
---|
| 87 |
|
---|
| 88 | if (isEqual(currentSelection, _nextSelection)) {
|
---|
| 89 | memoizedSelection = currentSelection;
|
---|
| 90 | return currentSelection;
|
---|
| 91 | }
|
---|
| 92 | }
|
---|
| 93 | }
|
---|
| 94 |
|
---|
| 95 | memoizedSelection = _nextSelection;
|
---|
| 96 | return _nextSelection;
|
---|
| 97 | } // We may be able to reuse the previous invocation's result.
|
---|
| 98 |
|
---|
| 99 |
|
---|
| 100 | // We may be able to reuse the previous invocation's result.
|
---|
| 101 | var prevSnapshot = memoizedSnapshot;
|
---|
| 102 | var prevSelection = memoizedSelection;
|
---|
| 103 |
|
---|
| 104 | if (objectIs(prevSnapshot, nextSnapshot)) {
|
---|
| 105 | // The snapshot is the same as last time. Reuse the previous selection.
|
---|
| 106 | return prevSelection;
|
---|
| 107 | } // The snapshot has changed, so we need to compute a new selection.
|
---|
| 108 |
|
---|
| 109 |
|
---|
| 110 | // The snapshot has changed, so we need to compute a new selection.
|
---|
| 111 | var nextSelection = selector(nextSnapshot); // If a custom isEqual function is provided, use that to check if the data
|
---|
| 112 | // has changed. If it hasn't, return the previous selection. That signals
|
---|
| 113 | // to React that the selections are conceptually equal, and we can bail
|
---|
| 114 | // out of rendering.
|
---|
| 115 |
|
---|
| 116 | // If a custom isEqual function is provided, use that to check if the data
|
---|
| 117 | // has changed. If it hasn't, return the previous selection. That signals
|
---|
| 118 | // to React that the selections are conceptually equal, and we can bail
|
---|
| 119 | // out of rendering.
|
---|
| 120 | if (isEqual !== undefined && isEqual(prevSelection, nextSelection)) {
|
---|
| 121 | return prevSelection;
|
---|
| 122 | }
|
---|
| 123 |
|
---|
| 124 | memoizedSnapshot = nextSnapshot;
|
---|
| 125 | memoizedSelection = nextSelection;
|
---|
| 126 | return nextSelection;
|
---|
| 127 | }; // Assigning this to a constant so that Flow knows it can't change.
|
---|
| 128 |
|
---|
| 129 |
|
---|
| 130 | // Assigning this to a constant so that Flow knows it can't change.
|
---|
| 131 | var maybeGetServerSnapshot = getServerSnapshot === undefined ? null : getServerSnapshot;
|
---|
| 132 |
|
---|
| 133 | var getSnapshotWithSelector = function () {
|
---|
| 134 | return memoizedSelector(getSnapshot());
|
---|
| 135 | };
|
---|
| 136 |
|
---|
| 137 | var getServerSnapshotWithSelector = maybeGetServerSnapshot === null ? undefined : function () {
|
---|
| 138 | return memoizedSelector(maybeGetServerSnapshot());
|
---|
| 139 | };
|
---|
| 140 | return [getSnapshotWithSelector, getServerSnapshotWithSelector];
|
---|
| 141 | }, [getSnapshot, getServerSnapshot, selector, isEqual]),
|
---|
| 142 | getSelection = _useMemo[0],
|
---|
| 143 | getServerSelection = _useMemo[1];
|
---|
| 144 |
|
---|
| 145 | var value = useSyncExternalStore(subscribe, getSelection, getServerSelection);
|
---|
| 146 | useEffect(function () {
|
---|
| 147 | inst.hasValue = true;
|
---|
| 148 | inst.value = value;
|
---|
| 149 | }, [value]);
|
---|
| 150 | useDebugValue(value);
|
---|
| 151 | return value;
|
---|
| 152 | }
|
---|
| 153 |
|
---|
| 154 | exports.useSyncExternalStoreWithSelector = useSyncExternalStoreWithSelector;
|
---|
| 155 | /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
---|
| 156 | if (
|
---|
| 157 | typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
---|
| 158 | typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop ===
|
---|
| 159 | 'function'
|
---|
| 160 | ) {
|
---|
| 161 | __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error());
|
---|
| 162 | }
|
---|
| 163 |
|
---|
| 164 | })();
|
---|
| 165 | }
|
---|