@inertiajs/react 2.0.16 → 2.1.0
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 +467 -327
- package/dist/index.esm.js.map +4 -4
- package/dist/index.js +480 -351
- package/dist/index.js.map +4 -4
- package/package.json +2 -2
- package/types/Deferred.d.ts +4 -4
- package/types/Form.d.ts +13 -0
- package/types/Link.d.ts +2 -2
- package/types/WhenVisible.d.ts +4 -4
- package/types/index.d.ts +1 -0
package/dist/index.esm.js
CHANGED
|
@@ -199,333 +199,71 @@ var Deferred = ({ children, data, fallback }) => {
|
|
|
199
199
|
useEffect2(() => {
|
|
200
200
|
setLoaded(keys.every((key) => pageProps[key] !== void 0));
|
|
201
201
|
}, [pageProps, keys]);
|
|
202
|
-
|
|
202
|
+
if (loaded) {
|
|
203
|
+
return typeof children === "function" ? children() : children;
|
|
204
|
+
}
|
|
205
|
+
return typeof fallback === "function" ? fallback() : fallback;
|
|
203
206
|
};
|
|
204
207
|
Deferred.displayName = "InertiaDeferred";
|
|
205
208
|
var Deferred_default = Deferred;
|
|
206
209
|
|
|
207
|
-
// src/
|
|
208
|
-
import { escape } from "es-toolkit";
|
|
209
|
-
import React, { useContext as useContext2, useEffect as useEffect3, useMemo as useMemo3 } from "react";
|
|
210
|
-
var Head = function({ children, title }) {
|
|
211
|
-
const headManager = useContext2(HeadContext_default);
|
|
212
|
-
const provider = useMemo3(() => headManager.createProvider(), [headManager]);
|
|
213
|
-
const isServer = typeof window === "undefined";
|
|
214
|
-
useEffect3(() => {
|
|
215
|
-
provider.reconnect();
|
|
216
|
-
provider.update(renderNodes(children));
|
|
217
|
-
return () => {
|
|
218
|
-
provider.disconnect();
|
|
219
|
-
};
|
|
220
|
-
}, [provider, children, title]);
|
|
221
|
-
function isUnaryTag(node) {
|
|
222
|
-
return [
|
|
223
|
-
"area",
|
|
224
|
-
"base",
|
|
225
|
-
"br",
|
|
226
|
-
"col",
|
|
227
|
-
"embed",
|
|
228
|
-
"hr",
|
|
229
|
-
"img",
|
|
230
|
-
"input",
|
|
231
|
-
"keygen",
|
|
232
|
-
"link",
|
|
233
|
-
"meta",
|
|
234
|
-
"param",
|
|
235
|
-
"source",
|
|
236
|
-
"track",
|
|
237
|
-
"wbr"
|
|
238
|
-
].indexOf(node.type) > -1;
|
|
239
|
-
}
|
|
240
|
-
function renderTagStart(node) {
|
|
241
|
-
const attrs = Object.keys(node.props).reduce((carry, name) => {
|
|
242
|
-
if (["head-key", "children", "dangerouslySetInnerHTML"].includes(name)) {
|
|
243
|
-
return carry;
|
|
244
|
-
}
|
|
245
|
-
const value = node.props[name];
|
|
246
|
-
if (value === "") {
|
|
247
|
-
return carry + ` ${name}`;
|
|
248
|
-
} else {
|
|
249
|
-
return carry + ` ${name}="${escape(value)}"`;
|
|
250
|
-
}
|
|
251
|
-
}, "");
|
|
252
|
-
return `<${node.type}${attrs}>`;
|
|
253
|
-
}
|
|
254
|
-
function renderTagChildren(node) {
|
|
255
|
-
return typeof node.props.children === "string" ? node.props.children : node.props.children.reduce((html, child) => html + renderTag(child), "");
|
|
256
|
-
}
|
|
257
|
-
function renderTag(node) {
|
|
258
|
-
let html = renderTagStart(node);
|
|
259
|
-
if (node.props.children) {
|
|
260
|
-
html += renderTagChildren(node);
|
|
261
|
-
}
|
|
262
|
-
if (node.props.dangerouslySetInnerHTML) {
|
|
263
|
-
html += node.props.dangerouslySetInnerHTML.__html;
|
|
264
|
-
}
|
|
265
|
-
if (!isUnaryTag(node)) {
|
|
266
|
-
html += `</${node.type}>`;
|
|
267
|
-
}
|
|
268
|
-
return html;
|
|
269
|
-
}
|
|
270
|
-
function ensureNodeHasInertiaProp(node) {
|
|
271
|
-
return React.cloneElement(node, {
|
|
272
|
-
inertia: node.props["head-key"] !== void 0 ? node.props["head-key"] : ""
|
|
273
|
-
});
|
|
274
|
-
}
|
|
275
|
-
function renderNode(node) {
|
|
276
|
-
return renderTag(ensureNodeHasInertiaProp(node));
|
|
277
|
-
}
|
|
278
|
-
function renderNodes(nodes) {
|
|
279
|
-
const computed = React.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
|
|
280
|
-
if (title && !computed.find((tag) => tag.startsWith("<title"))) {
|
|
281
|
-
computed.push(`<title inertia>${title}</title>`);
|
|
282
|
-
}
|
|
283
|
-
return computed;
|
|
284
|
-
}
|
|
285
|
-
if (isServer) {
|
|
286
|
-
provider.update(renderNodes(children));
|
|
287
|
-
}
|
|
288
|
-
return null;
|
|
289
|
-
};
|
|
290
|
-
var Head_default = Head;
|
|
291
|
-
|
|
292
|
-
// src/Link.ts
|
|
210
|
+
// src/Form.ts
|
|
293
211
|
import {
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
shouldIntercept
|
|
212
|
+
formDataToObject,
|
|
213
|
+
mergeDataIntoQueryString
|
|
297
214
|
} from "@inertiajs/core";
|
|
298
|
-
import {
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
preserveState = null,
|
|
309
|
-
replace = false,
|
|
310
|
-
only = [],
|
|
311
|
-
except = [],
|
|
312
|
-
headers = {},
|
|
313
|
-
queryStringArrayFormat = "brackets",
|
|
314
|
-
async = false,
|
|
315
|
-
onClick = noop,
|
|
316
|
-
onCancelToken = noop,
|
|
317
|
-
onBefore = noop,
|
|
318
|
-
onStart = noop,
|
|
319
|
-
onProgress = noop,
|
|
320
|
-
onFinish = noop,
|
|
321
|
-
onCancel = noop,
|
|
322
|
-
onSuccess = noop,
|
|
323
|
-
onError = noop,
|
|
324
|
-
prefetch = false,
|
|
325
|
-
cacheFor = 0,
|
|
326
|
-
...props
|
|
327
|
-
}, ref) => {
|
|
328
|
-
const [inFlightCount, setInFlightCount] = useState3(0);
|
|
329
|
-
const hoverTimeout = useRef(null);
|
|
330
|
-
const _method = useMemo4(() => {
|
|
331
|
-
return typeof href === "object" ? href.method : method.toLowerCase();
|
|
332
|
-
}, [href, method]);
|
|
333
|
-
const _as = useMemo4(() => {
|
|
334
|
-
as = as.toLowerCase();
|
|
335
|
-
return _method !== "get" ? "button" : as;
|
|
336
|
-
}, [as, _method]);
|
|
337
|
-
const mergeDataArray = useMemo4(
|
|
338
|
-
() => mergeDataIntoQueryString(
|
|
339
|
-
_method,
|
|
340
|
-
typeof href === "object" ? href.url : href || "",
|
|
341
|
-
data,
|
|
342
|
-
queryStringArrayFormat
|
|
343
|
-
),
|
|
344
|
-
[href, _method, data, queryStringArrayFormat]
|
|
345
|
-
);
|
|
346
|
-
const url = useMemo4(() => mergeDataArray[0], [mergeDataArray]);
|
|
347
|
-
const _data = useMemo4(() => mergeDataArray[1], [mergeDataArray]);
|
|
348
|
-
const baseParams = useMemo4(
|
|
349
|
-
() => ({
|
|
350
|
-
data: _data,
|
|
351
|
-
method: _method,
|
|
352
|
-
preserveScroll,
|
|
353
|
-
preserveState: preserveState ?? _method !== "get",
|
|
354
|
-
replace,
|
|
355
|
-
only,
|
|
356
|
-
except,
|
|
357
|
-
headers,
|
|
358
|
-
async
|
|
359
|
-
}),
|
|
360
|
-
[_data, _method, preserveScroll, preserveState, replace, only, except, headers, async]
|
|
361
|
-
);
|
|
362
|
-
const visitParams = useMemo4(
|
|
363
|
-
() => ({
|
|
364
|
-
...baseParams,
|
|
365
|
-
onCancelToken,
|
|
366
|
-
onBefore,
|
|
367
|
-
onStart(event) {
|
|
368
|
-
setInFlightCount((count) => count + 1);
|
|
369
|
-
onStart(event);
|
|
370
|
-
},
|
|
371
|
-
onProgress,
|
|
372
|
-
onFinish(event) {
|
|
373
|
-
setInFlightCount((count) => count - 1);
|
|
374
|
-
onFinish(event);
|
|
375
|
-
},
|
|
376
|
-
onCancel,
|
|
377
|
-
onSuccess,
|
|
378
|
-
onError
|
|
379
|
-
}),
|
|
380
|
-
[baseParams, onCancelToken, onBefore, onStart, onProgress, onFinish, onCancel, onSuccess, onError]
|
|
381
|
-
);
|
|
382
|
-
const doPrefetch = () => {
|
|
383
|
-
router4.prefetch(url, baseParams, { cacheFor: cacheForValue });
|
|
384
|
-
};
|
|
385
|
-
const prefetchModes = useMemo4(
|
|
386
|
-
() => {
|
|
387
|
-
if (prefetch === true) {
|
|
388
|
-
return ["hover"];
|
|
389
|
-
}
|
|
390
|
-
if (prefetch === false) {
|
|
391
|
-
return [];
|
|
392
|
-
}
|
|
393
|
-
if (Array.isArray(prefetch)) {
|
|
394
|
-
return prefetch;
|
|
395
|
-
}
|
|
396
|
-
return [prefetch];
|
|
397
|
-
},
|
|
398
|
-
Array.isArray(prefetch) ? prefetch : [prefetch]
|
|
399
|
-
);
|
|
400
|
-
const cacheForValue = useMemo4(() => {
|
|
401
|
-
if (cacheFor !== 0) {
|
|
402
|
-
return cacheFor;
|
|
403
|
-
}
|
|
404
|
-
if (prefetchModes.length === 1 && prefetchModes[0] === "click") {
|
|
405
|
-
return 0;
|
|
406
|
-
}
|
|
407
|
-
return 3e4;
|
|
408
|
-
}, [cacheFor, prefetchModes]);
|
|
409
|
-
useEffect4(() => {
|
|
410
|
-
return () => {
|
|
411
|
-
clearTimeout(hoverTimeout.current);
|
|
412
|
-
};
|
|
413
|
-
}, []);
|
|
414
|
-
useEffect4(() => {
|
|
415
|
-
if (prefetchModes.includes("mount")) {
|
|
416
|
-
setTimeout(() => doPrefetch());
|
|
417
|
-
}
|
|
418
|
-
}, prefetchModes);
|
|
419
|
-
const regularEvents = {
|
|
420
|
-
onClick: (event) => {
|
|
421
|
-
onClick(event);
|
|
422
|
-
if (shouldIntercept(event)) {
|
|
423
|
-
event.preventDefault();
|
|
424
|
-
router4.visit(url, visitParams);
|
|
425
|
-
}
|
|
426
|
-
}
|
|
427
|
-
};
|
|
428
|
-
const prefetchHoverEvents = {
|
|
429
|
-
onMouseEnter: () => {
|
|
430
|
-
hoverTimeout.current = window.setTimeout(() => {
|
|
431
|
-
doPrefetch();
|
|
432
|
-
}, 75);
|
|
433
|
-
},
|
|
434
|
-
onMouseLeave: () => {
|
|
435
|
-
clearTimeout(hoverTimeout.current);
|
|
436
|
-
},
|
|
437
|
-
onClick: regularEvents.onClick
|
|
438
|
-
};
|
|
439
|
-
const prefetchClickEvents = {
|
|
440
|
-
onMouseDown: (event) => {
|
|
441
|
-
if (shouldIntercept(event)) {
|
|
442
|
-
event.preventDefault();
|
|
443
|
-
doPrefetch();
|
|
444
|
-
}
|
|
445
|
-
},
|
|
446
|
-
onMouseUp: (event) => {
|
|
447
|
-
event.preventDefault();
|
|
448
|
-
router4.visit(url, visitParams);
|
|
449
|
-
},
|
|
450
|
-
onClick: (event) => {
|
|
451
|
-
onClick(event);
|
|
452
|
-
if (shouldIntercept(event)) {
|
|
453
|
-
event.preventDefault();
|
|
454
|
-
}
|
|
455
|
-
}
|
|
456
|
-
};
|
|
457
|
-
const elProps = useMemo4(
|
|
458
|
-
() => ({
|
|
459
|
-
a: { href: url },
|
|
460
|
-
button: { type: "button" }
|
|
461
|
-
}),
|
|
462
|
-
[url]
|
|
463
|
-
);
|
|
464
|
-
return createElement3(
|
|
465
|
-
_as,
|
|
466
|
-
{
|
|
467
|
-
...props,
|
|
468
|
-
...elProps[_as] || {},
|
|
469
|
-
ref,
|
|
470
|
-
...(() => {
|
|
471
|
-
if (prefetchModes.includes("hover")) {
|
|
472
|
-
return prefetchHoverEvents;
|
|
473
|
-
}
|
|
474
|
-
if (prefetchModes.includes("click")) {
|
|
475
|
-
return prefetchClickEvents;
|
|
476
|
-
}
|
|
477
|
-
return regularEvents;
|
|
478
|
-
})(),
|
|
479
|
-
"data-loading": inFlightCount > 0 ? "" : void 0
|
|
480
|
-
},
|
|
481
|
-
children
|
|
482
|
-
);
|
|
483
|
-
}
|
|
484
|
-
);
|
|
485
|
-
Link.displayName = "InertiaLink";
|
|
486
|
-
var Link_default = Link;
|
|
215
|
+
import { isEqual as isEqual2 } from "es-toolkit";
|
|
216
|
+
import {
|
|
217
|
+
createElement as createElement3,
|
|
218
|
+
forwardRef,
|
|
219
|
+
useEffect as useEffect5,
|
|
220
|
+
useImperativeHandle,
|
|
221
|
+
useMemo as useMemo4,
|
|
222
|
+
useRef as useRef2,
|
|
223
|
+
useState as useState5
|
|
224
|
+
} from "react";
|
|
487
225
|
|
|
488
226
|
// src/useForm.ts
|
|
489
227
|
import {
|
|
490
|
-
router as
|
|
228
|
+
router as router5
|
|
491
229
|
} from "@inertiajs/core";
|
|
492
230
|
import { cloneDeep, isEqual } from "es-toolkit";
|
|
493
231
|
import { get, has, set } from "es-toolkit/compat";
|
|
494
|
-
import { useCallback, useEffect as
|
|
232
|
+
import { useCallback, useEffect as useEffect4, useLayoutEffect, useMemo as useMemo3, useRef, useState as useState4 } from "react";
|
|
495
233
|
|
|
496
234
|
// src/useRemember.ts
|
|
497
|
-
import { router as
|
|
498
|
-
import { useEffect as
|
|
235
|
+
import { router as router4 } from "@inertiajs/core";
|
|
236
|
+
import { useEffect as useEffect3, useState as useState3 } from "react";
|
|
499
237
|
function useRemember(initialState, key) {
|
|
500
|
-
const [state, setState] =
|
|
501
|
-
const restored =
|
|
238
|
+
const [state, setState] = useState3(() => {
|
|
239
|
+
const restored = router4.restore(key);
|
|
502
240
|
return restored !== void 0 ? restored : initialState;
|
|
503
241
|
});
|
|
504
|
-
|
|
505
|
-
|
|
242
|
+
useEffect3(() => {
|
|
243
|
+
router4.remember(state, key);
|
|
506
244
|
}, [state, key]);
|
|
507
245
|
return [state, setState];
|
|
508
246
|
}
|
|
509
247
|
|
|
510
248
|
// src/useForm.ts
|
|
511
249
|
function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
|
|
512
|
-
const isMounted =
|
|
250
|
+
const isMounted = useRef(null);
|
|
513
251
|
const rememberKey = typeof rememberKeyOrInitialValues === "string" ? rememberKeyOrInitialValues : null;
|
|
514
|
-
const [defaults, setDefaults] =
|
|
252
|
+
const [defaults, setDefaults] = useState4(
|
|
515
253
|
(typeof rememberKeyOrInitialValues === "string" ? maybeInitialValues : rememberKeyOrInitialValues) || {}
|
|
516
254
|
);
|
|
517
|
-
const cancelToken =
|
|
518
|
-
const recentlySuccessfulTimeoutId =
|
|
519
|
-
const [data, setData] = rememberKey ? useRemember(defaults, `${rememberKey}:data`) :
|
|
520
|
-
const [errors, setErrors] = rememberKey ? useRemember({}, `${rememberKey}:errors`) :
|
|
521
|
-
const [hasErrors, setHasErrors] =
|
|
522
|
-
const [processing, setProcessing] =
|
|
523
|
-
const [progress, setProgress] =
|
|
524
|
-
const [wasSuccessful, setWasSuccessful] =
|
|
525
|
-
const [recentlySuccessful, setRecentlySuccessful] =
|
|
526
|
-
const transform =
|
|
527
|
-
const isDirty =
|
|
528
|
-
|
|
255
|
+
const cancelToken = useRef(null);
|
|
256
|
+
const recentlySuccessfulTimeoutId = useRef(null);
|
|
257
|
+
const [data, setData] = rememberKey ? useRemember(defaults, `${rememberKey}:data`) : useState4(defaults);
|
|
258
|
+
const [errors, setErrors] = rememberKey ? useRemember({}, `${rememberKey}:errors`) : useState4({});
|
|
259
|
+
const [hasErrors, setHasErrors] = useState4(false);
|
|
260
|
+
const [processing, setProcessing] = useState4(false);
|
|
261
|
+
const [progress, setProgress] = useState4(null);
|
|
262
|
+
const [wasSuccessful, setWasSuccessful] = useState4(false);
|
|
263
|
+
const [recentlySuccessful, setRecentlySuccessful] = useState4(false);
|
|
264
|
+
const transform = useRef((data2) => data2);
|
|
265
|
+
const isDirty = useMemo3(() => !isEqual(data, defaults), [data, defaults]);
|
|
266
|
+
useEffect4(() => {
|
|
529
267
|
isMounted.current = true;
|
|
530
268
|
return () => {
|
|
531
269
|
isMounted.current = false;
|
|
@@ -616,9 +354,9 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
|
|
|
616
354
|
}
|
|
617
355
|
};
|
|
618
356
|
if (method === "delete") {
|
|
619
|
-
|
|
357
|
+
router5.delete(url, { ..._options, data: transform.current(data) });
|
|
620
358
|
} else {
|
|
621
|
-
|
|
359
|
+
router5[method](url, transform.current(data), _options);
|
|
622
360
|
}
|
|
623
361
|
},
|
|
624
362
|
[data, setErrors, transform]
|
|
@@ -635,7 +373,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
|
|
|
635
373
|
},
|
|
636
374
|
[setData]
|
|
637
375
|
);
|
|
638
|
-
const [dataAsDefaults, setDataAsDefaults] =
|
|
376
|
+
const [dataAsDefaults, setDataAsDefaults] = useState4(false);
|
|
639
377
|
const setDefaultsFunction = useCallback(
|
|
640
378
|
(fieldOrFields, maybeValue) => {
|
|
641
379
|
if (typeof fieldOrFields === "undefined") {
|
|
@@ -753,20 +491,419 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
|
|
|
753
491
|
};
|
|
754
492
|
}
|
|
755
493
|
|
|
756
|
-
// src/
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
494
|
+
// src/Form.ts
|
|
495
|
+
var noop = () => void 0;
|
|
496
|
+
var Form = forwardRef(
|
|
497
|
+
({
|
|
498
|
+
action = "",
|
|
499
|
+
method = "get",
|
|
500
|
+
headers = {},
|
|
501
|
+
queryStringArrayFormat = "brackets",
|
|
502
|
+
errorBag = null,
|
|
503
|
+
showProgress = true,
|
|
504
|
+
transform = (data) => data,
|
|
505
|
+
options = {},
|
|
506
|
+
onStart = noop,
|
|
507
|
+
onProgress = noop,
|
|
508
|
+
onFinish = noop,
|
|
509
|
+
onBefore = noop,
|
|
510
|
+
onCancel = noop,
|
|
511
|
+
onSuccess = noop,
|
|
512
|
+
onError = noop,
|
|
513
|
+
onCancelToken = noop,
|
|
514
|
+
children,
|
|
515
|
+
...props
|
|
516
|
+
}, ref) => {
|
|
517
|
+
const form = useForm({});
|
|
518
|
+
const formElement = useRef2(null);
|
|
519
|
+
const resolvedMethod = useMemo4(() => {
|
|
520
|
+
return typeof action === "object" ? action.method : method.toLowerCase();
|
|
521
|
+
}, [action, method]);
|
|
522
|
+
const [isDirty, setIsDirty] = useState5(false);
|
|
523
|
+
const defaultValues = useRef2({});
|
|
524
|
+
const getData = () => {
|
|
525
|
+
return formDataToObject(new FormData(formElement.current));
|
|
526
|
+
};
|
|
527
|
+
const updateDirtyState = (event) => setIsDirty(event.type === "reset" ? false : !isEqual2(getData(), defaultValues.current));
|
|
528
|
+
useEffect5(() => {
|
|
529
|
+
defaultValues.current = getData();
|
|
530
|
+
const formEvents = ["input", "change", "reset"];
|
|
531
|
+
formEvents.forEach((e) => formElement.current.addEventListener(e, updateDirtyState));
|
|
532
|
+
return () => formEvents.forEach((e) => formElement.current?.removeEventListener(e, updateDirtyState));
|
|
533
|
+
}, []);
|
|
534
|
+
const submit = () => {
|
|
535
|
+
const [url, _data] = mergeDataIntoQueryString(
|
|
536
|
+
resolvedMethod,
|
|
537
|
+
typeof action === "object" ? action.url : action,
|
|
538
|
+
getData(),
|
|
539
|
+
queryStringArrayFormat
|
|
540
|
+
);
|
|
541
|
+
const submitOptions = {
|
|
542
|
+
headers,
|
|
543
|
+
errorBag,
|
|
544
|
+
showProgress,
|
|
545
|
+
onCancelToken,
|
|
546
|
+
onBefore,
|
|
547
|
+
onStart,
|
|
548
|
+
onProgress,
|
|
549
|
+
onFinish,
|
|
550
|
+
onCancel,
|
|
551
|
+
onSuccess,
|
|
552
|
+
onError,
|
|
553
|
+
...options
|
|
554
|
+
};
|
|
555
|
+
form.transform(() => transform(_data));
|
|
556
|
+
form.submit(resolvedMethod, url, submitOptions);
|
|
557
|
+
};
|
|
558
|
+
useImperativeHandle(
|
|
559
|
+
ref,
|
|
560
|
+
() => ({
|
|
561
|
+
errors: form.errors,
|
|
562
|
+
hasErrors: form.hasErrors,
|
|
563
|
+
processing: form.processing,
|
|
564
|
+
progress: form.progress,
|
|
565
|
+
wasSuccessful: form.wasSuccessful,
|
|
566
|
+
recentlySuccessful: form.recentlySuccessful,
|
|
567
|
+
clearErrors: form.clearErrors,
|
|
568
|
+
resetAndClearErrors: form.resetAndClearErrors,
|
|
569
|
+
setError: form.setError,
|
|
570
|
+
isDirty,
|
|
571
|
+
reset: () => formElement.current?.reset(),
|
|
572
|
+
submit
|
|
573
|
+
}),
|
|
574
|
+
[form, isDirty, submit]
|
|
575
|
+
);
|
|
576
|
+
return createElement3(
|
|
577
|
+
"form",
|
|
578
|
+
{
|
|
579
|
+
...props,
|
|
580
|
+
ref: formElement,
|
|
581
|
+
action: typeof action === "object" ? action.url : action,
|
|
582
|
+
method: resolvedMethod,
|
|
583
|
+
onSubmit: (event) => {
|
|
584
|
+
event.preventDefault();
|
|
585
|
+
submit();
|
|
586
|
+
}
|
|
587
|
+
},
|
|
588
|
+
typeof children === "function" ? children({
|
|
589
|
+
errors: form.errors,
|
|
590
|
+
hasErrors: form.hasErrors,
|
|
591
|
+
processing: form.processing,
|
|
592
|
+
progress: form.progress,
|
|
593
|
+
wasSuccessful: form.wasSuccessful,
|
|
594
|
+
recentlySuccessful: form.recentlySuccessful,
|
|
595
|
+
setError: form.setError,
|
|
596
|
+
clearErrors: form.clearErrors,
|
|
597
|
+
resetAndClearErrors: form.resetAndClearErrors,
|
|
598
|
+
isDirty,
|
|
599
|
+
reset: () => formElement.current?.reset(),
|
|
600
|
+
submit
|
|
601
|
+
}) : children
|
|
602
|
+
);
|
|
603
|
+
}
|
|
604
|
+
);
|
|
605
|
+
Form.displayName = "InertiaForm";
|
|
606
|
+
var Form_default = Form;
|
|
607
|
+
|
|
608
|
+
// src/Head.ts
|
|
609
|
+
import { escape } from "es-toolkit";
|
|
610
|
+
import React, { useContext as useContext2, useEffect as useEffect6, useMemo as useMemo5 } from "react";
|
|
611
|
+
var Head = function({ children, title }) {
|
|
612
|
+
const headManager = useContext2(HeadContext_default);
|
|
613
|
+
const provider = useMemo5(() => headManager.createProvider(), [headManager]);
|
|
614
|
+
const isServer = typeof window === "undefined";
|
|
615
|
+
useEffect6(() => {
|
|
616
|
+
provider.reconnect();
|
|
617
|
+
provider.update(renderNodes(children));
|
|
618
|
+
return () => {
|
|
619
|
+
provider.disconnect();
|
|
620
|
+
};
|
|
621
|
+
}, [provider, children, title]);
|
|
622
|
+
function isUnaryTag(node) {
|
|
623
|
+
return [
|
|
624
|
+
"area",
|
|
625
|
+
"base",
|
|
626
|
+
"br",
|
|
627
|
+
"col",
|
|
628
|
+
"embed",
|
|
629
|
+
"hr",
|
|
630
|
+
"img",
|
|
631
|
+
"input",
|
|
632
|
+
"keygen",
|
|
633
|
+
"link",
|
|
634
|
+
"meta",
|
|
635
|
+
"param",
|
|
636
|
+
"source",
|
|
637
|
+
"track",
|
|
638
|
+
"wbr"
|
|
639
|
+
].indexOf(node.type) > -1;
|
|
640
|
+
}
|
|
641
|
+
function renderTagStart(node) {
|
|
642
|
+
const attrs = Object.keys(node.props).reduce((carry, name) => {
|
|
643
|
+
if (["head-key", "children", "dangerouslySetInnerHTML"].includes(name)) {
|
|
644
|
+
return carry;
|
|
645
|
+
}
|
|
646
|
+
const value = String(node.props[name]);
|
|
647
|
+
if (value === "") {
|
|
648
|
+
return carry + ` ${name}`;
|
|
649
|
+
} else {
|
|
650
|
+
return carry + ` ${name}="${escape(value)}"`;
|
|
651
|
+
}
|
|
652
|
+
}, "");
|
|
653
|
+
return `<${node.type}${attrs}>`;
|
|
654
|
+
}
|
|
655
|
+
function renderTagChildren(node) {
|
|
656
|
+
return typeof node.props.children === "string" ? node.props.children : node.props.children.reduce((html, child) => html + renderTag(child), "");
|
|
657
|
+
}
|
|
658
|
+
function renderTag(node) {
|
|
659
|
+
let html = renderTagStart(node);
|
|
660
|
+
if (node.props.children) {
|
|
661
|
+
html += renderTagChildren(node);
|
|
662
|
+
}
|
|
663
|
+
if (node.props.dangerouslySetInnerHTML) {
|
|
664
|
+
html += node.props.dangerouslySetInnerHTML.__html;
|
|
665
|
+
}
|
|
666
|
+
if (!isUnaryTag(node)) {
|
|
667
|
+
html += `</${node.type}>`;
|
|
668
|
+
}
|
|
669
|
+
return html;
|
|
670
|
+
}
|
|
671
|
+
function ensureNodeHasInertiaProp(node) {
|
|
672
|
+
return React.cloneElement(node, {
|
|
673
|
+
inertia: node.props["head-key"] !== void 0 ? node.props["head-key"] : ""
|
|
674
|
+
});
|
|
675
|
+
}
|
|
676
|
+
function renderNode(node) {
|
|
677
|
+
return renderTag(ensureNodeHasInertiaProp(node));
|
|
678
|
+
}
|
|
679
|
+
function renderNodes(nodes) {
|
|
680
|
+
const computed = React.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
|
|
681
|
+
if (title && !computed.find((tag) => tag.startsWith("<title"))) {
|
|
682
|
+
computed.push(`<title inertia>${title}</title>`);
|
|
683
|
+
}
|
|
684
|
+
return computed;
|
|
685
|
+
}
|
|
686
|
+
if (isServer) {
|
|
687
|
+
provider.update(renderNodes(children));
|
|
688
|
+
}
|
|
689
|
+
return null;
|
|
690
|
+
};
|
|
691
|
+
var Head_default = Head;
|
|
692
|
+
|
|
693
|
+
// src/Link.ts
|
|
694
|
+
import {
|
|
695
|
+
mergeDataIntoQueryString as mergeDataIntoQueryString2,
|
|
696
|
+
router as router6,
|
|
697
|
+
shouldIntercept
|
|
698
|
+
} from "@inertiajs/core";
|
|
699
|
+
import { createElement as createElement4, forwardRef as forwardRef2, useEffect as useEffect7, useMemo as useMemo6, useRef as useRef3, useState as useState6 } from "react";
|
|
700
|
+
var noop2 = () => void 0;
|
|
701
|
+
var Link = forwardRef2(
|
|
702
|
+
({
|
|
703
|
+
children,
|
|
704
|
+
as = "a",
|
|
705
|
+
data = {},
|
|
706
|
+
href,
|
|
707
|
+
method = "get",
|
|
708
|
+
preserveScroll = false,
|
|
709
|
+
preserveState = null,
|
|
710
|
+
replace = false,
|
|
711
|
+
only = [],
|
|
712
|
+
except = [],
|
|
713
|
+
headers = {},
|
|
714
|
+
queryStringArrayFormat = "brackets",
|
|
715
|
+
async = false,
|
|
716
|
+
onClick = noop2,
|
|
717
|
+
onCancelToken = noop2,
|
|
718
|
+
onBefore = noop2,
|
|
719
|
+
onStart = noop2,
|
|
720
|
+
onProgress = noop2,
|
|
721
|
+
onFinish = noop2,
|
|
722
|
+
onCancel = noop2,
|
|
723
|
+
onSuccess = noop2,
|
|
724
|
+
onError = noop2,
|
|
725
|
+
prefetch = false,
|
|
726
|
+
cacheFor = 0,
|
|
727
|
+
...props
|
|
728
|
+
}, ref) => {
|
|
729
|
+
const [inFlightCount, setInFlightCount] = useState6(0);
|
|
730
|
+
const hoverTimeout = useRef3(null);
|
|
731
|
+
const _method = useMemo6(() => {
|
|
732
|
+
return typeof href === "object" ? href.method : method.toLowerCase();
|
|
733
|
+
}, [href, method]);
|
|
734
|
+
const _as = useMemo6(() => {
|
|
735
|
+
if (typeof as !== "string") {
|
|
736
|
+
return as;
|
|
737
|
+
}
|
|
738
|
+
return _method !== "get" ? "button" : as.toLowerCase();
|
|
739
|
+
}, [as, _method]);
|
|
740
|
+
const mergeDataArray = useMemo6(
|
|
741
|
+
() => mergeDataIntoQueryString2(
|
|
742
|
+
_method,
|
|
743
|
+
typeof href === "object" ? href.url : href || "",
|
|
744
|
+
data,
|
|
745
|
+
queryStringArrayFormat
|
|
746
|
+
),
|
|
747
|
+
[href, _method, data, queryStringArrayFormat]
|
|
748
|
+
);
|
|
749
|
+
const url = useMemo6(() => mergeDataArray[0], [mergeDataArray]);
|
|
750
|
+
const _data = useMemo6(() => mergeDataArray[1], [mergeDataArray]);
|
|
751
|
+
const baseParams = useMemo6(
|
|
752
|
+
() => ({
|
|
753
|
+
data: _data,
|
|
754
|
+
method: _method,
|
|
755
|
+
preserveScroll,
|
|
756
|
+
preserveState: preserveState ?? _method !== "get",
|
|
757
|
+
replace,
|
|
758
|
+
only,
|
|
759
|
+
except,
|
|
760
|
+
headers,
|
|
761
|
+
async
|
|
762
|
+
}),
|
|
763
|
+
[_data, _method, preserveScroll, preserveState, replace, only, except, headers, async]
|
|
764
|
+
);
|
|
765
|
+
const visitParams = useMemo6(
|
|
766
|
+
() => ({
|
|
767
|
+
...baseParams,
|
|
768
|
+
onCancelToken,
|
|
769
|
+
onBefore,
|
|
770
|
+
onStart(event) {
|
|
771
|
+
setInFlightCount((count) => count + 1);
|
|
772
|
+
onStart(event);
|
|
773
|
+
},
|
|
774
|
+
onProgress,
|
|
775
|
+
onFinish(event) {
|
|
776
|
+
setInFlightCount((count) => count - 1);
|
|
777
|
+
onFinish(event);
|
|
778
|
+
},
|
|
779
|
+
onCancel,
|
|
780
|
+
onSuccess,
|
|
781
|
+
onError
|
|
782
|
+
}),
|
|
783
|
+
[baseParams, onCancelToken, onBefore, onStart, onProgress, onFinish, onCancel, onSuccess, onError]
|
|
784
|
+
);
|
|
785
|
+
const doPrefetch = () => {
|
|
786
|
+
router6.prefetch(url, baseParams, { cacheFor: cacheForValue });
|
|
787
|
+
};
|
|
788
|
+
const prefetchModes = useMemo6(
|
|
789
|
+
() => {
|
|
790
|
+
if (prefetch === true) {
|
|
791
|
+
return ["hover"];
|
|
792
|
+
}
|
|
793
|
+
if (prefetch === false) {
|
|
794
|
+
return [];
|
|
795
|
+
}
|
|
796
|
+
if (Array.isArray(prefetch)) {
|
|
797
|
+
return prefetch;
|
|
798
|
+
}
|
|
799
|
+
return [prefetch];
|
|
800
|
+
},
|
|
801
|
+
Array.isArray(prefetch) ? prefetch : [prefetch]
|
|
802
|
+
);
|
|
803
|
+
const cacheForValue = useMemo6(() => {
|
|
804
|
+
if (cacheFor !== 0) {
|
|
805
|
+
return cacheFor;
|
|
806
|
+
}
|
|
807
|
+
if (prefetchModes.length === 1 && prefetchModes[0] === "click") {
|
|
808
|
+
return 0;
|
|
809
|
+
}
|
|
810
|
+
return 3e4;
|
|
811
|
+
}, [cacheFor, prefetchModes]);
|
|
812
|
+
useEffect7(() => {
|
|
813
|
+
return () => {
|
|
814
|
+
clearTimeout(hoverTimeout.current);
|
|
815
|
+
};
|
|
816
|
+
}, []);
|
|
817
|
+
useEffect7(() => {
|
|
818
|
+
if (prefetchModes.includes("mount")) {
|
|
819
|
+
setTimeout(() => doPrefetch());
|
|
820
|
+
}
|
|
821
|
+
}, prefetchModes);
|
|
822
|
+
const regularEvents = {
|
|
823
|
+
onClick: (event) => {
|
|
824
|
+
onClick(event);
|
|
825
|
+
if (shouldIntercept(event)) {
|
|
826
|
+
event.preventDefault();
|
|
827
|
+
router6.visit(url, visitParams);
|
|
828
|
+
}
|
|
829
|
+
}
|
|
830
|
+
};
|
|
831
|
+
const prefetchHoverEvents = {
|
|
832
|
+
onMouseEnter: () => {
|
|
833
|
+
hoverTimeout.current = window.setTimeout(() => {
|
|
834
|
+
doPrefetch();
|
|
835
|
+
}, 75);
|
|
836
|
+
},
|
|
837
|
+
onMouseLeave: () => {
|
|
838
|
+
clearTimeout(hoverTimeout.current);
|
|
839
|
+
},
|
|
840
|
+
onClick: regularEvents.onClick
|
|
841
|
+
};
|
|
842
|
+
const prefetchClickEvents = {
|
|
843
|
+
onMouseDown: (event) => {
|
|
844
|
+
if (shouldIntercept(event)) {
|
|
845
|
+
event.preventDefault();
|
|
846
|
+
doPrefetch();
|
|
847
|
+
}
|
|
848
|
+
},
|
|
849
|
+
onMouseUp: (event) => {
|
|
850
|
+
event.preventDefault();
|
|
851
|
+
router6.visit(url, visitParams);
|
|
852
|
+
},
|
|
853
|
+
onClick: (event) => {
|
|
854
|
+
onClick(event);
|
|
855
|
+
if (shouldIntercept(event)) {
|
|
856
|
+
event.preventDefault();
|
|
857
|
+
}
|
|
858
|
+
}
|
|
859
|
+
};
|
|
860
|
+
const elProps = useMemo6(() => {
|
|
861
|
+
if (_as === "button") {
|
|
862
|
+
return { type: "button" };
|
|
863
|
+
}
|
|
864
|
+
if (_as === "a" || typeof _as !== "string") {
|
|
865
|
+
return { href: url };
|
|
866
|
+
}
|
|
867
|
+
return {};
|
|
868
|
+
}, [_as, url]);
|
|
869
|
+
return createElement4(
|
|
870
|
+
_as,
|
|
871
|
+
{
|
|
872
|
+
...props,
|
|
873
|
+
...elProps,
|
|
874
|
+
ref,
|
|
875
|
+
...(() => {
|
|
876
|
+
if (prefetchModes.includes("hover")) {
|
|
877
|
+
return prefetchHoverEvents;
|
|
878
|
+
}
|
|
879
|
+
if (prefetchModes.includes("click")) {
|
|
880
|
+
return prefetchClickEvents;
|
|
881
|
+
}
|
|
882
|
+
return regularEvents;
|
|
883
|
+
})(),
|
|
884
|
+
"data-loading": inFlightCount > 0 ? "" : void 0
|
|
885
|
+
},
|
|
886
|
+
children
|
|
887
|
+
);
|
|
888
|
+
}
|
|
889
|
+
);
|
|
890
|
+
Link.displayName = "InertiaLink";
|
|
891
|
+
var Link_default = Link;
|
|
892
|
+
|
|
893
|
+
// src/usePoll.ts
|
|
894
|
+
import { router as router7 } from "@inertiajs/core";
|
|
895
|
+
import { useEffect as useEffect8, useRef as useRef4 } from "react";
|
|
896
|
+
function usePoll(interval, requestOptions = {}, options = {
|
|
897
|
+
keepAlive: false,
|
|
898
|
+
autoStart: true
|
|
899
|
+
}) {
|
|
900
|
+
const pollRef = useRef4(
|
|
764
901
|
router7.poll(interval, requestOptions, {
|
|
765
902
|
...options,
|
|
766
903
|
autoStart: false
|
|
767
904
|
})
|
|
768
905
|
);
|
|
769
|
-
|
|
906
|
+
useEffect8(() => {
|
|
770
907
|
if (options.autoStart ?? true) {
|
|
771
908
|
pollRef.current.start();
|
|
772
909
|
}
|
|
@@ -780,14 +917,14 @@ function usePoll(interval, requestOptions = {}, options = {
|
|
|
780
917
|
|
|
781
918
|
// src/usePrefetch.ts
|
|
782
919
|
import { router as router8 } from "@inertiajs/core";
|
|
783
|
-
import { useEffect as
|
|
920
|
+
import { useEffect as useEffect9, useState as useState7 } from "react";
|
|
784
921
|
function usePrefetch(options = {}) {
|
|
785
922
|
const cached = typeof window === "undefined" ? null : router8.getCached(window.location.pathname, options);
|
|
786
923
|
const inFlight = typeof window === "undefined" ? null : router8.getPrefetching(window.location.pathname, options);
|
|
787
|
-
const [lastUpdatedAt, setLastUpdatedAt] =
|
|
788
|
-
const [isPrefetching, setIsPrefetching] =
|
|
789
|
-
const [isPrefetched, setIsPrefetched] =
|
|
790
|
-
|
|
924
|
+
const [lastUpdatedAt, setLastUpdatedAt] = useState7(cached?.staleTimestamp || null);
|
|
925
|
+
const [isPrefetching, setIsPrefetching] = useState7(inFlight !== null);
|
|
926
|
+
const [isPrefetched, setIsPrefetched] = useState7(cached !== null);
|
|
927
|
+
useEffect9(() => {
|
|
791
928
|
const onPrefetchingListener = router8.on("prefetching", (e) => {
|
|
792
929
|
if (e.detail.visit.url.pathname === window.location.pathname) {
|
|
793
930
|
setIsPrefetching(true);
|
|
@@ -815,15 +952,15 @@ function usePrefetch(options = {}) {
|
|
|
815
952
|
|
|
816
953
|
// src/WhenVisible.ts
|
|
817
954
|
import { router as router9 } from "@inertiajs/core";
|
|
818
|
-
import { createElement as
|
|
955
|
+
import { createElement as createElement5, useCallback as useCallback2, useEffect as useEffect10, useRef as useRef5, useState as useState8 } from "react";
|
|
819
956
|
var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) => {
|
|
820
957
|
always = always ?? false;
|
|
821
958
|
as = as ?? "div";
|
|
822
959
|
fallback = fallback ?? null;
|
|
823
|
-
const [loaded, setLoaded] =
|
|
824
|
-
const hasFetched =
|
|
825
|
-
const fetching =
|
|
826
|
-
const ref =
|
|
960
|
+
const [loaded, setLoaded] = useState8(false);
|
|
961
|
+
const hasFetched = useRef5(false);
|
|
962
|
+
const fetching = useRef5(false);
|
|
963
|
+
const ref = useRef5(null);
|
|
827
964
|
const getReloadParams = useCallback2(() => {
|
|
828
965
|
if (data) {
|
|
829
966
|
return {
|
|
@@ -835,7 +972,7 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
|
|
|
835
972
|
}
|
|
836
973
|
return params;
|
|
837
974
|
}, [params, data]);
|
|
838
|
-
|
|
975
|
+
useEffect10(() => {
|
|
839
976
|
if (!ref.current) {
|
|
840
977
|
return;
|
|
841
978
|
}
|
|
@@ -878,17 +1015,19 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
|
|
|
878
1015
|
observer.disconnect();
|
|
879
1016
|
};
|
|
880
1017
|
}, [ref, getReloadParams, buffer]);
|
|
1018
|
+
const resolveChildren = () => typeof children === "function" ? children() : children;
|
|
1019
|
+
const resolveFallback = () => typeof fallback === "function" ? fallback() : fallback;
|
|
881
1020
|
if (always || !loaded) {
|
|
882
|
-
return
|
|
1021
|
+
return createElement5(
|
|
883
1022
|
as,
|
|
884
1023
|
{
|
|
885
1024
|
props: null,
|
|
886
1025
|
ref
|
|
887
1026
|
},
|
|
888
|
-
loaded ?
|
|
1027
|
+
loaded ? resolveChildren() : resolveFallback()
|
|
889
1028
|
);
|
|
890
1029
|
}
|
|
891
|
-
return loaded ?
|
|
1030
|
+
return loaded ? resolveChildren() : null;
|
|
892
1031
|
};
|
|
893
1032
|
WhenVisible.displayName = "InertiaWhenVisible";
|
|
894
1033
|
var WhenVisible_default = WhenVisible;
|
|
@@ -897,6 +1036,7 @@ var WhenVisible_default = WhenVisible;
|
|
|
897
1036
|
var router3 = Router;
|
|
898
1037
|
export {
|
|
899
1038
|
Deferred_default as Deferred,
|
|
1039
|
+
Form_default as Form,
|
|
900
1040
|
Head_default as Head,
|
|
901
1041
|
Link_default as Link,
|
|
902
1042
|
WhenVisible_default as WhenVisible,
|