@inertiajs/react 2.2.3 → 2.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.esm.js +36 -29
- package/dist/index.esm.js.map +4 -4
- package/dist/index.js +130 -123
- package/dist/index.js.map +4 -4
- package/package.json +5 -3
- package/types/react.d.ts +2 -0
package/dist/index.esm.js
CHANGED
|
@@ -218,7 +218,7 @@ import { isEqual as isEqual2 } from "lodash-es";
|
|
|
218
218
|
import React, {
|
|
219
219
|
createElement as createElement3,
|
|
220
220
|
forwardRef,
|
|
221
|
-
useEffect as
|
|
221
|
+
useEffect as useEffect6,
|
|
222
222
|
useImperativeHandle,
|
|
223
223
|
useMemo as useMemo4,
|
|
224
224
|
useRef as useRef2,
|
|
@@ -230,17 +230,23 @@ import {
|
|
|
230
230
|
router as router5
|
|
231
231
|
} from "@inertiajs/core";
|
|
232
232
|
import { cloneDeep, get, has, isEqual, set } from "lodash-es";
|
|
233
|
-
import { useCallback, useEffect as
|
|
233
|
+
import { useCallback, useEffect as useEffect5, useMemo as useMemo3, useRef, useState as useState4 } from "react";
|
|
234
|
+
|
|
235
|
+
// src/react.ts
|
|
236
|
+
import { useEffect as useEffect3, useLayoutEffect } from "react";
|
|
237
|
+
function useIsomorphicLayoutEffect(effect, deps) {
|
|
238
|
+
typeof window === "undefined" ? useEffect3(effect, deps) : useLayoutEffect(effect, deps);
|
|
239
|
+
}
|
|
234
240
|
|
|
235
241
|
// src/useRemember.ts
|
|
236
242
|
import { router as router4 } from "@inertiajs/core";
|
|
237
|
-
import { useEffect as
|
|
243
|
+
import { useEffect as useEffect4, useState as useState3 } from "react";
|
|
238
244
|
function useRemember(initialState, key) {
|
|
239
245
|
const [state, setState] = useState3(() => {
|
|
240
246
|
const restored = router4.restore(key);
|
|
241
247
|
return restored !== void 0 ? restored : initialState;
|
|
242
248
|
});
|
|
243
|
-
|
|
249
|
+
useEffect4(() => {
|
|
244
250
|
router4.remember(state, key);
|
|
245
251
|
}, [state, key]);
|
|
246
252
|
return [state, setState];
|
|
@@ -264,7 +270,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
|
|
|
264
270
|
const [recentlySuccessful, setRecentlySuccessful] = useState4(false);
|
|
265
271
|
const transform = useRef((data2) => data2);
|
|
266
272
|
const isDirty = useMemo3(() => !isEqual(data, defaults), [data, defaults]);
|
|
267
|
-
|
|
273
|
+
useEffect5(() => {
|
|
268
274
|
isMounted.current = true;
|
|
269
275
|
return () => {
|
|
270
276
|
isMounted.current = false;
|
|
@@ -382,7 +388,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
|
|
|
382
388
|
);
|
|
383
389
|
const [dataAsDefaults, setDataAsDefaults] = useState4(false);
|
|
384
390
|
const dataRef = useRef(data);
|
|
385
|
-
|
|
391
|
+
useEffect5(() => {
|
|
386
392
|
dataRef.current = data;
|
|
387
393
|
});
|
|
388
394
|
const setDefaultsFunction = useCallback(
|
|
@@ -399,7 +405,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
|
|
|
399
405
|
},
|
|
400
406
|
[setDefaults]
|
|
401
407
|
);
|
|
402
|
-
|
|
408
|
+
useIsomorphicLayoutEffect(() => {
|
|
403
409
|
if (!dataAsDefaults) {
|
|
404
410
|
return;
|
|
405
411
|
}
|
|
@@ -547,7 +553,7 @@ var Form = forwardRef(
|
|
|
547
553
|
const updateDirtyState = (event) => deferStateUpdate(
|
|
548
554
|
() => setIsDirty(event.type === "reset" ? false : !isEqual2(getData(), formDataToObject(defaultData.current)))
|
|
549
555
|
);
|
|
550
|
-
|
|
556
|
+
useEffect6(() => {
|
|
551
557
|
defaultData.current = getFormData();
|
|
552
558
|
const formEvents = ["input", "change", "reset"];
|
|
553
559
|
formEvents.forEach((e) => formElement.current.addEventListener(e, updateDirtyState));
|
|
@@ -654,12 +660,12 @@ var Form_default = Form;
|
|
|
654
660
|
|
|
655
661
|
// src/Head.ts
|
|
656
662
|
import { escape } from "lodash-es";
|
|
657
|
-
import React2, { useContext as useContext2, useEffect as
|
|
663
|
+
import React2, { useContext as useContext2, useEffect as useEffect7, useMemo as useMemo5 } from "react";
|
|
658
664
|
var Head = function({ children, title }) {
|
|
659
665
|
const headManager = useContext2(HeadContext_default);
|
|
660
666
|
const provider = useMemo5(() => headManager.createProvider(), [headManager]);
|
|
661
667
|
const isServer = typeof window === "undefined";
|
|
662
|
-
|
|
668
|
+
useEffect7(() => {
|
|
663
669
|
provider.reconnect();
|
|
664
670
|
provider.update(renderNodes(children));
|
|
665
671
|
return () => {
|
|
@@ -746,7 +752,7 @@ import React3, {
|
|
|
746
752
|
createElement as createElement4,
|
|
747
753
|
forwardRef as forwardRef2,
|
|
748
754
|
useCallback as useCallback2,
|
|
749
|
-
useEffect as
|
|
755
|
+
useEffect as useEffect8,
|
|
750
756
|
useImperativeHandle as useImperativeHandle2,
|
|
751
757
|
useMemo as useMemo6,
|
|
752
758
|
useRef as useRef3,
|
|
@@ -803,15 +809,15 @@ var InfiniteScroll = forwardRef2(
|
|
|
803
809
|
const [resolvedStartElement, setResolvedStartElement] = useState6(null);
|
|
804
810
|
const [resolvedEndElement, setResolvedEndElement] = useState6(null);
|
|
805
811
|
const [resolvedItemsElement, setResolvedItemsElement] = useState6(null);
|
|
806
|
-
|
|
812
|
+
useEffect8(() => {
|
|
807
813
|
const element = startElement ? resolveHTMLElement(startElement, startElementFromRef) : startElementFromRef;
|
|
808
814
|
setResolvedStartElement(element);
|
|
809
815
|
}, [startElement, startElementFromRef]);
|
|
810
|
-
|
|
816
|
+
useEffect8(() => {
|
|
811
817
|
const element = endElement ? resolveHTMLElement(endElement, endElementFromRef) : endElementFromRef;
|
|
812
818
|
setResolvedEndElement(element);
|
|
813
819
|
}, [endElement, endElementFromRef]);
|
|
814
|
-
|
|
820
|
+
useEffect8(() => {
|
|
815
821
|
const element = itemsElement ? resolveHTMLElement(itemsElement, itemsElementFromRef) : itemsElementFromRef;
|
|
816
822
|
setResolvedItemsElement(element);
|
|
817
823
|
}, [itemsElement, itemsElementFromRef]);
|
|
@@ -846,7 +852,7 @@ var InfiniteScroll = forwardRef2(
|
|
|
846
852
|
});
|
|
847
853
|
}
|
|
848
854
|
}, [scrollableParent]);
|
|
849
|
-
|
|
855
|
+
useEffect8(() => {
|
|
850
856
|
if (!resolvedItemsElement) {
|
|
851
857
|
return;
|
|
852
858
|
}
|
|
@@ -884,8 +890,7 @@ var InfiniteScroll = forwardRef2(
|
|
|
884
890
|
elementManager2.enableTriggers();
|
|
885
891
|
}
|
|
886
892
|
return () => {
|
|
887
|
-
|
|
888
|
-
elementManager2.flushAll();
|
|
893
|
+
infiniteScrollInstance.flush();
|
|
889
894
|
setInfiniteScroll(null);
|
|
890
895
|
};
|
|
891
896
|
}, [data, resolvedItemsElement, resolvedStartElement, resolvedEndElement, scrollableParent]);
|
|
@@ -894,10 +899,10 @@ var InfiniteScroll = forwardRef2(
|
|
|
894
899
|
[manual, manualAfter, requestCount]
|
|
895
900
|
);
|
|
896
901
|
const autoLoad = useMemo6(() => !manualMode, [manualMode]);
|
|
897
|
-
|
|
902
|
+
useEffect8(() => {
|
|
898
903
|
autoLoad ? elementManager?.enableTriggers() : elementManager?.disableTriggers();
|
|
899
904
|
}, [autoLoad, onlyNext, onlyPrevious, resolvedStartElement, resolvedEndElement]);
|
|
900
|
-
|
|
905
|
+
useEffect8(() => {
|
|
901
906
|
const shouldAutoScroll = autoScroll !== void 0 ? autoScroll : reverse;
|
|
902
907
|
if (shouldAutoScroll) {
|
|
903
908
|
scrollToBottom();
|
|
@@ -988,7 +993,7 @@ import {
|
|
|
988
993
|
shouldIntercept,
|
|
989
994
|
shouldNavigate
|
|
990
995
|
} from "@inertiajs/core";
|
|
991
|
-
import { createElement as createElement5, forwardRef as forwardRef3, useEffect as
|
|
996
|
+
import { createElement as createElement5, forwardRef as forwardRef3, useEffect as useEffect9, useMemo as useMemo7, useRef as useRef4, useState as useState7 } from "react";
|
|
992
997
|
var noop2 = () => void 0;
|
|
993
998
|
var Link = forwardRef3(
|
|
994
999
|
({
|
|
@@ -999,6 +1004,7 @@ var Link = forwardRef3(
|
|
|
999
1004
|
method = "get",
|
|
1000
1005
|
preserveScroll = false,
|
|
1001
1006
|
preserveState = null,
|
|
1007
|
+
preserveUrl = false,
|
|
1002
1008
|
replace = false,
|
|
1003
1009
|
only = [],
|
|
1004
1010
|
except = [],
|
|
@@ -1044,13 +1050,14 @@ var Link = forwardRef3(
|
|
|
1044
1050
|
method: _method,
|
|
1045
1051
|
preserveScroll,
|
|
1046
1052
|
preserveState: preserveState ?? _method !== "get",
|
|
1053
|
+
preserveUrl,
|
|
1047
1054
|
replace,
|
|
1048
1055
|
only,
|
|
1049
1056
|
except,
|
|
1050
1057
|
headers,
|
|
1051
1058
|
async
|
|
1052
1059
|
}),
|
|
1053
|
-
[_data, _method, preserveScroll, preserveState, replace, only, except, headers, async]
|
|
1060
|
+
[_data, _method, preserveScroll, preserveState, preserveUrl, replace, only, except, headers, async]
|
|
1054
1061
|
);
|
|
1055
1062
|
const visitParams = useMemo7(
|
|
1056
1063
|
() => ({
|
|
@@ -1109,12 +1116,12 @@ var Link = forwardRef3(
|
|
|
1109
1116
|
);
|
|
1110
1117
|
};
|
|
1111
1118
|
}, [url, baseParams, onPrefetching, onPrefetched, cacheForValue, cacheTags]);
|
|
1112
|
-
|
|
1119
|
+
useEffect9(() => {
|
|
1113
1120
|
return () => {
|
|
1114
1121
|
clearTimeout(hoverTimeout.current);
|
|
1115
1122
|
};
|
|
1116
1123
|
}, []);
|
|
1117
|
-
|
|
1124
|
+
useEffect9(() => {
|
|
1118
1125
|
if (prefetchModes.includes("mount")) {
|
|
1119
1126
|
setTimeout(() => doPrefetch());
|
|
1120
1127
|
}
|
|
@@ -1204,7 +1211,7 @@ var Link_default = Link;
|
|
|
1204
1211
|
|
|
1205
1212
|
// src/usePoll.ts
|
|
1206
1213
|
import { router as router7 } from "@inertiajs/core";
|
|
1207
|
-
import { useEffect as
|
|
1214
|
+
import { useEffect as useEffect10, useRef as useRef5 } from "react";
|
|
1208
1215
|
function usePoll(interval, requestOptions = {}, options = {
|
|
1209
1216
|
keepAlive: false,
|
|
1210
1217
|
autoStart: true
|
|
@@ -1215,7 +1222,7 @@ function usePoll(interval, requestOptions = {}, options = {
|
|
|
1215
1222
|
autoStart: false
|
|
1216
1223
|
})
|
|
1217
1224
|
);
|
|
1218
|
-
|
|
1225
|
+
useEffect10(() => {
|
|
1219
1226
|
if (options.autoStart ?? true) {
|
|
1220
1227
|
pollRef.current.start();
|
|
1221
1228
|
}
|
|
@@ -1229,14 +1236,14 @@ function usePoll(interval, requestOptions = {}, options = {
|
|
|
1229
1236
|
|
|
1230
1237
|
// src/usePrefetch.ts
|
|
1231
1238
|
import { router as router8 } from "@inertiajs/core";
|
|
1232
|
-
import { useEffect as
|
|
1239
|
+
import { useEffect as useEffect11, useState as useState8 } from "react";
|
|
1233
1240
|
function usePrefetch(options = {}) {
|
|
1234
1241
|
const cached = typeof window === "undefined" ? null : router8.getCached(window.location.pathname, options);
|
|
1235
1242
|
const inFlight = typeof window === "undefined" ? null : router8.getPrefetching(window.location.pathname, options);
|
|
1236
1243
|
const [lastUpdatedAt, setLastUpdatedAt] = useState8(cached?.staleTimestamp || null);
|
|
1237
1244
|
const [isPrefetching, setIsPrefetching] = useState8(inFlight !== null);
|
|
1238
1245
|
const [isPrefetched, setIsPrefetched] = useState8(cached !== null);
|
|
1239
|
-
|
|
1246
|
+
useEffect11(() => {
|
|
1240
1247
|
const onPrefetchingListener = router8.on("prefetching", (e) => {
|
|
1241
1248
|
if (e.detail.visit.url.pathname === window.location.pathname) {
|
|
1242
1249
|
setIsPrefetching(true);
|
|
@@ -1264,7 +1271,7 @@ function usePrefetch(options = {}) {
|
|
|
1264
1271
|
|
|
1265
1272
|
// src/WhenVisible.ts
|
|
1266
1273
|
import { router as router9 } from "@inertiajs/core";
|
|
1267
|
-
import { createElement as createElement6, useCallback as useCallback3, useEffect as
|
|
1274
|
+
import { createElement as createElement6, useCallback as useCallback3, useEffect as useEffect12, useRef as useRef6, useState as useState9 } from "react";
|
|
1268
1275
|
var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) => {
|
|
1269
1276
|
always = always ?? false;
|
|
1270
1277
|
as = as ?? "div";
|
|
@@ -1284,7 +1291,7 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
|
|
|
1284
1291
|
}
|
|
1285
1292
|
return params;
|
|
1286
1293
|
}, [params, data]);
|
|
1287
|
-
|
|
1294
|
+
useEffect12(() => {
|
|
1288
1295
|
if (!ref.current) {
|
|
1289
1296
|
return;
|
|
1290
1297
|
}
|