@inertiajs/react 2.0.17 → 2.1.1

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.js CHANGED
@@ -30,6 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
30
30
  var index_exports = {};
31
31
  __export(index_exports, {
32
32
  Deferred: () => Deferred_default,
33
+ Form: () => Form_default,
33
34
  Head: () => Head_default,
34
35
  Link: () => Link_default,
35
36
  WhenVisible: () => WhenVisible_default,
@@ -42,7 +43,7 @@ __export(index_exports, {
42
43
  useRemember: () => useRemember
43
44
  });
44
45
  module.exports = __toCommonJS(index_exports);
45
- var import_core9 = require("@inertiajs/core");
46
+ var import_core10 = require("@inertiajs/core");
46
47
 
47
48
  // src/createInertiaApp.ts
48
49
  var import_core2 = require("@inertiajs/core");
@@ -242,333 +243,64 @@ var Deferred = ({ children, data, fallback }) => {
242
243
  (0, import_react6.useEffect)(() => {
243
244
  setLoaded(keys.every((key) => pageProps[key] !== void 0));
244
245
  }, [pageProps, keys]);
245
- return loaded ? children : fallback;
246
+ if (loaded) {
247
+ return typeof children === "function" ? children() : children;
248
+ }
249
+ return typeof fallback === "function" ? fallback() : fallback;
246
250
  };
247
251
  Deferred.displayName = "InertiaDeferred";
248
252
  var Deferred_default = Deferred;
249
253
 
250
- // src/Head.ts
251
- var import_es_toolkit = require("es-toolkit");
252
- var import_react7 = __toESM(require("react"), 1);
253
- var Head = function({ children, title }) {
254
- const headManager = (0, import_react7.useContext)(HeadContext_default);
255
- const provider = (0, import_react7.useMemo)(() => headManager.createProvider(), [headManager]);
256
- const isServer = typeof window === "undefined";
257
- (0, import_react7.useEffect)(() => {
258
- provider.reconnect();
259
- provider.update(renderNodes(children));
260
- return () => {
261
- provider.disconnect();
262
- };
263
- }, [provider, children, title]);
264
- function isUnaryTag(node) {
265
- return [
266
- "area",
267
- "base",
268
- "br",
269
- "col",
270
- "embed",
271
- "hr",
272
- "img",
273
- "input",
274
- "keygen",
275
- "link",
276
- "meta",
277
- "param",
278
- "source",
279
- "track",
280
- "wbr"
281
- ].indexOf(node.type) > -1;
282
- }
283
- function renderTagStart(node) {
284
- const attrs = Object.keys(node.props).reduce((carry, name) => {
285
- if (["head-key", "children", "dangerouslySetInnerHTML"].includes(name)) {
286
- return carry;
287
- }
288
- const value = String(node.props[name]);
289
- if (value === "") {
290
- return carry + ` ${name}`;
291
- } else {
292
- return carry + ` ${name}="${(0, import_es_toolkit.escape)(value)}"`;
293
- }
294
- }, "");
295
- return `<${node.type}${attrs}>`;
296
- }
297
- function renderTagChildren(node) {
298
- return typeof node.props.children === "string" ? node.props.children : node.props.children.reduce((html, child) => html + renderTag(child), "");
299
- }
300
- function renderTag(node) {
301
- let html = renderTagStart(node);
302
- if (node.props.children) {
303
- html += renderTagChildren(node);
304
- }
305
- if (node.props.dangerouslySetInnerHTML) {
306
- html += node.props.dangerouslySetInnerHTML.__html;
307
- }
308
- if (!isUnaryTag(node)) {
309
- html += `</${node.type}>`;
310
- }
311
- return html;
312
- }
313
- function ensureNodeHasInertiaProp(node) {
314
- return import_react7.default.cloneElement(node, {
315
- inertia: node.props["head-key"] !== void 0 ? node.props["head-key"] : ""
316
- });
317
- }
318
- function renderNode(node) {
319
- return renderTag(ensureNodeHasInertiaProp(node));
320
- }
321
- function renderNodes(nodes) {
322
- const computed = import_react7.default.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
323
- if (title && !computed.find((tag) => tag.startsWith("<title"))) {
324
- computed.push(`<title inertia>${title}</title>`);
325
- }
326
- return computed;
327
- }
328
- if (isServer) {
329
- provider.update(renderNodes(children));
330
- }
331
- return null;
332
- };
333
- var Head_default = Head;
334
-
335
- // src/Link.ts
336
- var import_core3 = require("@inertiajs/core");
337
- var import_react8 = require("react");
338
- var noop = () => void 0;
339
- var Link = (0, import_react8.forwardRef)(
340
- ({
341
- children,
342
- as = "a",
343
- data = {},
344
- href,
345
- method = "get",
346
- preserveScroll = false,
347
- preserveState = null,
348
- replace = false,
349
- only = [],
350
- except = [],
351
- headers = {},
352
- queryStringArrayFormat = "brackets",
353
- async = false,
354
- onClick = noop,
355
- onCancelToken = noop,
356
- onBefore = noop,
357
- onStart = noop,
358
- onProgress = noop,
359
- onFinish = noop,
360
- onCancel = noop,
361
- onSuccess = noop,
362
- onError = noop,
363
- prefetch = false,
364
- cacheFor = 0,
365
- ...props
366
- }, ref) => {
367
- const [inFlightCount, setInFlightCount] = (0, import_react8.useState)(0);
368
- const hoverTimeout = (0, import_react8.useRef)(null);
369
- const _method = (0, import_react8.useMemo)(() => {
370
- return typeof href === "object" ? href.method : method.toLowerCase();
371
- }, [href, method]);
372
- const _as = (0, import_react8.useMemo)(() => {
373
- as = as.toLowerCase();
374
- return _method !== "get" ? "button" : as;
375
- }, [as, _method]);
376
- const mergeDataArray = (0, import_react8.useMemo)(
377
- () => (0, import_core3.mergeDataIntoQueryString)(
378
- _method,
379
- typeof href === "object" ? href.url : href || "",
380
- data,
381
- queryStringArrayFormat
382
- ),
383
- [href, _method, data, queryStringArrayFormat]
384
- );
385
- const url = (0, import_react8.useMemo)(() => mergeDataArray[0], [mergeDataArray]);
386
- const _data = (0, import_react8.useMemo)(() => mergeDataArray[1], [mergeDataArray]);
387
- const baseParams = (0, import_react8.useMemo)(
388
- () => ({
389
- data: _data,
390
- method: _method,
391
- preserveScroll,
392
- preserveState: preserveState ?? _method !== "get",
393
- replace,
394
- only,
395
- except,
396
- headers,
397
- async
398
- }),
399
- [_data, _method, preserveScroll, preserveState, replace, only, except, headers, async]
400
- );
401
- const visitParams = (0, import_react8.useMemo)(
402
- () => ({
403
- ...baseParams,
404
- onCancelToken,
405
- onBefore,
406
- onStart(event) {
407
- setInFlightCount((count) => count + 1);
408
- onStart(event);
409
- },
410
- onProgress,
411
- onFinish(event) {
412
- setInFlightCount((count) => count - 1);
413
- onFinish(event);
414
- },
415
- onCancel,
416
- onSuccess,
417
- onError
418
- }),
419
- [baseParams, onCancelToken, onBefore, onStart, onProgress, onFinish, onCancel, onSuccess, onError]
420
- );
421
- const doPrefetch = () => {
422
- import_core3.router.prefetch(url, baseParams, { cacheFor: cacheForValue });
423
- };
424
- const prefetchModes = (0, import_react8.useMemo)(
425
- () => {
426
- if (prefetch === true) {
427
- return ["hover"];
428
- }
429
- if (prefetch === false) {
430
- return [];
431
- }
432
- if (Array.isArray(prefetch)) {
433
- return prefetch;
434
- }
435
- return [prefetch];
436
- },
437
- Array.isArray(prefetch) ? prefetch : [prefetch]
438
- );
439
- const cacheForValue = (0, import_react8.useMemo)(() => {
440
- if (cacheFor !== 0) {
441
- return cacheFor;
442
- }
443
- if (prefetchModes.length === 1 && prefetchModes[0] === "click") {
444
- return 0;
445
- }
446
- return 3e4;
447
- }, [cacheFor, prefetchModes]);
448
- (0, import_react8.useEffect)(() => {
449
- return () => {
450
- clearTimeout(hoverTimeout.current);
451
- };
452
- }, []);
453
- (0, import_react8.useEffect)(() => {
454
- if (prefetchModes.includes("mount")) {
455
- setTimeout(() => doPrefetch());
456
- }
457
- }, prefetchModes);
458
- const regularEvents = {
459
- onClick: (event) => {
460
- onClick(event);
461
- if ((0, import_core3.shouldIntercept)(event)) {
462
- event.preventDefault();
463
- import_core3.router.visit(url, visitParams);
464
- }
465
- }
466
- };
467
- const prefetchHoverEvents = {
468
- onMouseEnter: () => {
469
- hoverTimeout.current = window.setTimeout(() => {
470
- doPrefetch();
471
- }, 75);
472
- },
473
- onMouseLeave: () => {
474
- clearTimeout(hoverTimeout.current);
475
- },
476
- onClick: regularEvents.onClick
477
- };
478
- const prefetchClickEvents = {
479
- onMouseDown: (event) => {
480
- if ((0, import_core3.shouldIntercept)(event)) {
481
- event.preventDefault();
482
- doPrefetch();
483
- }
484
- },
485
- onMouseUp: (event) => {
486
- event.preventDefault();
487
- import_core3.router.visit(url, visitParams);
488
- },
489
- onClick: (event) => {
490
- onClick(event);
491
- if ((0, import_core3.shouldIntercept)(event)) {
492
- event.preventDefault();
493
- }
494
- }
495
- };
496
- const elProps = (0, import_react8.useMemo)(
497
- () => ({
498
- a: { href: url },
499
- button: { type: "button" }
500
- }),
501
- [url]
502
- );
503
- return (0, import_react8.createElement)(
504
- _as,
505
- {
506
- ...props,
507
- ...elProps[_as] || {},
508
- ref,
509
- ...(() => {
510
- if (prefetchModes.includes("hover")) {
511
- return prefetchHoverEvents;
512
- }
513
- if (prefetchModes.includes("click")) {
514
- return prefetchClickEvents;
515
- }
516
- return regularEvents;
517
- })(),
518
- "data-loading": inFlightCount > 0 ? "" : void 0
519
- },
520
- children
521
- );
522
- }
523
- );
524
- Link.displayName = "InertiaLink";
525
- var Link_default = Link;
526
-
527
- // src/useForm.ts
254
+ // src/Form.ts
528
255
  var import_core5 = require("@inertiajs/core");
529
256
  var import_es_toolkit2 = require("es-toolkit");
257
+ var import_react9 = require("react");
258
+
259
+ // src/useForm.ts
260
+ var import_core4 = require("@inertiajs/core");
261
+ var import_es_toolkit = require("es-toolkit");
530
262
  var import_compat = require("es-toolkit/compat");
531
- var import_react10 = require("react");
263
+ var import_react8 = require("react");
532
264
 
533
265
  // src/useRemember.ts
534
- var import_core4 = require("@inertiajs/core");
535
- var import_react9 = require("react");
266
+ var import_core3 = require("@inertiajs/core");
267
+ var import_react7 = require("react");
536
268
  function useRemember(initialState, key) {
537
- const [state, setState] = (0, import_react9.useState)(() => {
538
- const restored = import_core4.router.restore(key);
269
+ const [state, setState] = (0, import_react7.useState)(() => {
270
+ const restored = import_core3.router.restore(key);
539
271
  return restored !== void 0 ? restored : initialState;
540
272
  });
541
- (0, import_react9.useEffect)(() => {
542
- import_core4.router.remember(state, key);
273
+ (0, import_react7.useEffect)(() => {
274
+ import_core3.router.remember(state, key);
543
275
  }, [state, key]);
544
276
  return [state, setState];
545
277
  }
546
278
 
547
279
  // src/useForm.ts
548
280
  function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
549
- const isMounted = (0, import_react10.useRef)(null);
281
+ const isMounted = (0, import_react8.useRef)(null);
550
282
  const rememberKey = typeof rememberKeyOrInitialValues === "string" ? rememberKeyOrInitialValues : null;
551
- const [defaults, setDefaults] = (0, import_react10.useState)(
283
+ const [defaults, setDefaults] = (0, import_react8.useState)(
552
284
  (typeof rememberKeyOrInitialValues === "string" ? maybeInitialValues : rememberKeyOrInitialValues) || {}
553
285
  );
554
- const cancelToken = (0, import_react10.useRef)(null);
555
- const recentlySuccessfulTimeoutId = (0, import_react10.useRef)(null);
556
- const [data, setData] = rememberKey ? useRemember(defaults, `${rememberKey}:data`) : (0, import_react10.useState)(defaults);
557
- const [errors, setErrors] = rememberKey ? useRemember({}, `${rememberKey}:errors`) : (0, import_react10.useState)({});
558
- const [hasErrors, setHasErrors] = (0, import_react10.useState)(false);
559
- const [processing, setProcessing] = (0, import_react10.useState)(false);
560
- const [progress, setProgress] = (0, import_react10.useState)(null);
561
- const [wasSuccessful, setWasSuccessful] = (0, import_react10.useState)(false);
562
- const [recentlySuccessful, setRecentlySuccessful] = (0, import_react10.useState)(false);
563
- const transform = (0, import_react10.useRef)((data2) => data2);
564
- const isDirty = (0, import_react10.useMemo)(() => !(0, import_es_toolkit2.isEqual)(data, defaults), [data, defaults]);
565
- (0, import_react10.useEffect)(() => {
286
+ const cancelToken = (0, import_react8.useRef)(null);
287
+ const recentlySuccessfulTimeoutId = (0, import_react8.useRef)(null);
288
+ const [data, setData] = rememberKey ? useRemember(defaults, `${rememberKey}:data`) : (0, import_react8.useState)(defaults);
289
+ const [errors, setErrors] = rememberKey ? useRemember({}, `${rememberKey}:errors`) : (0, import_react8.useState)({});
290
+ const [hasErrors, setHasErrors] = (0, import_react8.useState)(false);
291
+ const [processing, setProcessing] = (0, import_react8.useState)(false);
292
+ const [progress, setProgress] = (0, import_react8.useState)(null);
293
+ const [wasSuccessful, setWasSuccessful] = (0, import_react8.useState)(false);
294
+ const [recentlySuccessful, setRecentlySuccessful] = (0, import_react8.useState)(false);
295
+ const transform = (0, import_react8.useRef)((data2) => data2);
296
+ const isDirty = (0, import_react8.useMemo)(() => !(0, import_es_toolkit.isEqual)(data, defaults), [data, defaults]);
297
+ (0, import_react8.useEffect)(() => {
566
298
  isMounted.current = true;
567
299
  return () => {
568
300
  isMounted.current = false;
569
301
  };
570
302
  }, []);
571
- const submit = (0, import_react10.useCallback)(
303
+ const submit = (0, import_react8.useCallback)(
572
304
  (...args) => {
573
305
  const objectPassed = typeof args[0] === "object";
574
306
  const method = objectPassed ? args[0].method : args[0];
@@ -610,7 +342,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
610
342
  setHasErrors(false);
611
343
  setWasSuccessful(true);
612
344
  setRecentlySuccessful(true);
613
- setDefaults((0, import_es_toolkit2.cloneDeep)(data));
345
+ setDefaults((0, import_es_toolkit.cloneDeep)(data));
614
346
  recentlySuccessfulTimeoutId.current = setTimeout(() => {
615
347
  if (isMounted.current) {
616
348
  setRecentlySuccessful(false);
@@ -653,17 +385,17 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
653
385
  }
654
386
  };
655
387
  if (method === "delete") {
656
- import_core5.router.delete(url, { ..._options, data: transform.current(data) });
388
+ import_core4.router.delete(url, { ..._options, data: transform.current(data) });
657
389
  } else {
658
- import_core5.router[method](url, transform.current(data), _options);
390
+ import_core4.router[method](url, transform.current(data), _options);
659
391
  }
660
392
  },
661
393
  [data, setErrors, transform]
662
394
  );
663
- const setDataFunction = (0, import_react10.useCallback)(
395
+ const setDataFunction = (0, import_react8.useCallback)(
664
396
  (keyOrData, maybeValue) => {
665
397
  if (typeof keyOrData === "string") {
666
- setData((data2) => (0, import_compat.set)((0, import_es_toolkit2.cloneDeep)(data2), keyOrData, maybeValue));
398
+ setData((data2) => (0, import_compat.set)((0, import_es_toolkit.cloneDeep)(data2), keyOrData, maybeValue));
667
399
  } else if (typeof keyOrData === "function") {
668
400
  setData((data2) => keyOrData(data2));
669
401
  } else {
@@ -672,21 +404,21 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
672
404
  },
673
405
  [setData]
674
406
  );
675
- const [dataAsDefaults, setDataAsDefaults] = (0, import_react10.useState)(false);
676
- const setDefaultsFunction = (0, import_react10.useCallback)(
407
+ const [dataAsDefaults, setDataAsDefaults] = (0, import_react8.useState)(false);
408
+ const setDefaultsFunction = (0, import_react8.useCallback)(
677
409
  (fieldOrFields, maybeValue) => {
678
410
  if (typeof fieldOrFields === "undefined") {
679
411
  setDefaults(data);
680
412
  setDataAsDefaults(true);
681
413
  } else {
682
414
  setDefaults((defaults2) => {
683
- return typeof fieldOrFields === "string" ? (0, import_compat.set)((0, import_es_toolkit2.cloneDeep)(defaults2), fieldOrFields, maybeValue) : Object.assign((0, import_es_toolkit2.cloneDeep)(defaults2), fieldOrFields);
415
+ return typeof fieldOrFields === "string" ? (0, import_compat.set)((0, import_es_toolkit.cloneDeep)(defaults2), fieldOrFields, maybeValue) : Object.assign((0, import_es_toolkit.cloneDeep)(defaults2), fieldOrFields);
684
416
  });
685
417
  }
686
418
  },
687
419
  [data, setDefaults]
688
420
  );
689
- (0, import_react10.useLayoutEffect)(() => {
421
+ (0, import_react8.useLayoutEffect)(() => {
690
422
  if (!dataAsDefaults) {
691
423
  return;
692
424
  }
@@ -695,7 +427,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
695
427
  }
696
428
  setDataAsDefaults(false);
697
429
  }, [dataAsDefaults]);
698
- const reset = (0, import_react10.useCallback)(
430
+ const reset = (0, import_react8.useCallback)(
699
431
  (...fields) => {
700
432
  if (fields.length === 0) {
701
433
  setData(defaults);
@@ -712,7 +444,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
712
444
  },
713
445
  [setData, defaults]
714
446
  );
715
- const setError = (0, import_react10.useCallback)(
447
+ const setError = (0, import_react8.useCallback)(
716
448
  (fieldOrFields, maybeValue) => {
717
449
  setErrors((errors2) => {
718
450
  const newErrors = {
@@ -725,7 +457,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
725
457
  },
726
458
  [setErrors, setHasErrors]
727
459
  );
728
- const clearErrors = (0, import_react10.useCallback)(
460
+ const clearErrors = (0, import_react8.useCallback)(
729
461
  (...fields) => {
730
462
  setErrors((errors2) => {
731
463
  const newErrors = Object.keys(errors2).reduce(
@@ -741,7 +473,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
741
473
  },
742
474
  [setErrors, setHasErrors]
743
475
  );
744
- const resetAndClearErrors = (0, import_react10.useCallback)(
476
+ const resetAndClearErrors = (0, import_react8.useCallback)(
745
477
  (...fields) => {
746
478
  reset(...fields);
747
479
  clearErrors(...fields);
@@ -751,17 +483,17 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
751
483
  const createSubmitMethod = (method) => (url, options) => {
752
484
  submit(method, url, options);
753
485
  };
754
- const getMethod = (0, import_react10.useCallback)(createSubmitMethod("get"), [submit]);
755
- const post = (0, import_react10.useCallback)(createSubmitMethod("post"), [submit]);
756
- const put = (0, import_react10.useCallback)(createSubmitMethod("put"), [submit]);
757
- const patch = (0, import_react10.useCallback)(createSubmitMethod("patch"), [submit]);
758
- const deleteMethod = (0, import_react10.useCallback)(createSubmitMethod("delete"), [submit]);
759
- const cancel = (0, import_react10.useCallback)(() => {
486
+ const getMethod = (0, import_react8.useCallback)(createSubmitMethod("get"), [submit]);
487
+ const post = (0, import_react8.useCallback)(createSubmitMethod("post"), [submit]);
488
+ const put = (0, import_react8.useCallback)(createSubmitMethod("put"), [submit]);
489
+ const patch = (0, import_react8.useCallback)(createSubmitMethod("patch"), [submit]);
490
+ const deleteMethod = (0, import_react8.useCallback)(createSubmitMethod("delete"), [submit]);
491
+ const cancel = (0, import_react8.useCallback)(() => {
760
492
  if (cancelToken.current) {
761
493
  cancelToken.current.cancel();
762
494
  }
763
495
  }, []);
764
- const transformFunction = (0, import_react10.useCallback)((callback) => {
496
+ const transformFunction = (0, import_react8.useCallback)((callback) => {
765
497
  transform.current = callback;
766
498
  }, []);
767
499
  return {
@@ -790,20 +522,426 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
790
522
  };
791
523
  }
792
524
 
793
- // src/usePoll.ts
794
- var import_core6 = require("@inertiajs/core");
795
- var import_react11 = require("react");
796
- function usePoll(interval, requestOptions = {}, options = {
797
- keepAlive: false,
798
- autoStart: true
799
- }) {
800
- const pollRef = (0, import_react11.useRef)(
801
- import_core6.router.poll(interval, requestOptions, {
802
- ...options,
803
- autoStart: false
804
- })
805
- );
806
- (0, import_react11.useEffect)(() => {
525
+ // src/Form.ts
526
+ var noop = () => void 0;
527
+ var Form = (0, import_react9.forwardRef)(
528
+ ({
529
+ action = "",
530
+ method = "get",
531
+ headers = {},
532
+ queryStringArrayFormat = "brackets",
533
+ errorBag = null,
534
+ showProgress = true,
535
+ transform = (data) => data,
536
+ options = {},
537
+ onStart = noop,
538
+ onProgress = noop,
539
+ onFinish = noop,
540
+ onBefore = noop,
541
+ onCancel = noop,
542
+ onSuccess = noop,
543
+ onError = noop,
544
+ onCancelToken = noop,
545
+ onSubmitComplete = noop,
546
+ disableWhileProcessing = false,
547
+ children,
548
+ ...props
549
+ }, ref) => {
550
+ const form = useForm({});
551
+ const formElement = (0, import_react9.useRef)(null);
552
+ const resolvedMethod = (0, import_react9.useMemo)(() => {
553
+ return typeof action === "object" ? action.method : method.toLowerCase();
554
+ }, [action, method]);
555
+ const [isDirty, setIsDirty] = (0, import_react9.useState)(false);
556
+ const defaultData = (0, import_react9.useRef)(new FormData());
557
+ const getFormData = () => new FormData(formElement.current);
558
+ const getData = () => (0, import_core5.formDataToObject)(getFormData());
559
+ const updateDirtyState = (event) => setIsDirty(event.type === "reset" ? false : !(0, import_es_toolkit2.isEqual)(getData(), (0, import_core5.formDataToObject)(defaultData.current)));
560
+ (0, import_react9.useEffect)(() => {
561
+ defaultData.current = getFormData();
562
+ const formEvents = ["input", "change", "reset"];
563
+ formEvents.forEach((e) => formElement.current.addEventListener(e, updateDirtyState));
564
+ return () => formEvents.forEach((e) => formElement.current?.removeEventListener(e, updateDirtyState));
565
+ }, []);
566
+ const reset = (...fields) => {
567
+ (0, import_core5.resetFormFields)(formElement.current, defaultData.current, fields);
568
+ };
569
+ const resetAndClearErrors = (...fields) => {
570
+ form.clearErrors(...fields);
571
+ reset(...fields);
572
+ };
573
+ const submit = () => {
574
+ const [url, _data] = (0, import_core5.mergeDataIntoQueryString)(
575
+ resolvedMethod,
576
+ typeof action === "object" ? action.url : action,
577
+ getData(),
578
+ queryStringArrayFormat
579
+ );
580
+ const submitOptions = {
581
+ headers,
582
+ errorBag,
583
+ showProgress,
584
+ onCancelToken,
585
+ onBefore,
586
+ onStart,
587
+ onProgress,
588
+ onFinish,
589
+ onCancel,
590
+ onSuccess: (...args) => {
591
+ onSuccess(...args);
592
+ onSubmitComplete({
593
+ reset,
594
+ defaults
595
+ });
596
+ },
597
+ onError,
598
+ ...options
599
+ };
600
+ form.transform(() => transform(_data));
601
+ form.submit(resolvedMethod, url, submitOptions);
602
+ };
603
+ const defaults = () => {
604
+ defaultData.current = getFormData();
605
+ setIsDirty(false);
606
+ };
607
+ const exposed = () => ({
608
+ errors: form.errors,
609
+ hasErrors: form.hasErrors,
610
+ processing: form.processing,
611
+ progress: form.progress,
612
+ wasSuccessful: form.wasSuccessful,
613
+ recentlySuccessful: form.recentlySuccessful,
614
+ isDirty,
615
+ clearErrors: form.clearErrors,
616
+ resetAndClearErrors,
617
+ setError: form.setError,
618
+ reset,
619
+ submit,
620
+ defaults
621
+ });
622
+ (0, import_react9.useImperativeHandle)(ref, exposed, [form, isDirty, submit]);
623
+ return (0, import_react9.createElement)(
624
+ "form",
625
+ {
626
+ ...props,
627
+ ref: formElement,
628
+ action: typeof action === "object" ? action.url : action,
629
+ method: resolvedMethod,
630
+ onSubmit: (event) => {
631
+ event.preventDefault();
632
+ submit();
633
+ },
634
+ inert: disableWhileProcessing && form.processing
635
+ },
636
+ typeof children === "function" ? children(exposed()) : children
637
+ );
638
+ }
639
+ );
640
+ Form.displayName = "InertiaForm";
641
+ var Form_default = Form;
642
+
643
+ // src/Head.ts
644
+ var import_es_toolkit3 = require("es-toolkit");
645
+ var import_react10 = __toESM(require("react"), 1);
646
+ var Head = function({ children, title }) {
647
+ const headManager = (0, import_react10.useContext)(HeadContext_default);
648
+ const provider = (0, import_react10.useMemo)(() => headManager.createProvider(), [headManager]);
649
+ const isServer = typeof window === "undefined";
650
+ (0, import_react10.useEffect)(() => {
651
+ provider.reconnect();
652
+ provider.update(renderNodes(children));
653
+ return () => {
654
+ provider.disconnect();
655
+ };
656
+ }, [provider, children, title]);
657
+ function isUnaryTag(node) {
658
+ return [
659
+ "area",
660
+ "base",
661
+ "br",
662
+ "col",
663
+ "embed",
664
+ "hr",
665
+ "img",
666
+ "input",
667
+ "keygen",
668
+ "link",
669
+ "meta",
670
+ "param",
671
+ "source",
672
+ "track",
673
+ "wbr"
674
+ ].indexOf(node.type) > -1;
675
+ }
676
+ function renderTagStart(node) {
677
+ const attrs = Object.keys(node.props).reduce((carry, name) => {
678
+ if (["head-key", "children", "dangerouslySetInnerHTML"].includes(name)) {
679
+ return carry;
680
+ }
681
+ const value = String(node.props[name]);
682
+ if (value === "") {
683
+ return carry + ` ${name}`;
684
+ } else {
685
+ return carry + ` ${name}="${(0, import_es_toolkit3.escape)(value)}"`;
686
+ }
687
+ }, "");
688
+ return `<${node.type}${attrs}>`;
689
+ }
690
+ function renderTagChildren(node) {
691
+ return typeof node.props.children === "string" ? node.props.children : node.props.children.reduce((html, child) => html + renderTag(child), "");
692
+ }
693
+ function renderTag(node) {
694
+ let html = renderTagStart(node);
695
+ if (node.props.children) {
696
+ html += renderTagChildren(node);
697
+ }
698
+ if (node.props.dangerouslySetInnerHTML) {
699
+ html += node.props.dangerouslySetInnerHTML.__html;
700
+ }
701
+ if (!isUnaryTag(node)) {
702
+ html += `</${node.type}>`;
703
+ }
704
+ return html;
705
+ }
706
+ function ensureNodeHasInertiaProp(node) {
707
+ return import_react10.default.cloneElement(node, {
708
+ inertia: node.props["head-key"] !== void 0 ? node.props["head-key"] : ""
709
+ });
710
+ }
711
+ function renderNode(node) {
712
+ return renderTag(ensureNodeHasInertiaProp(node));
713
+ }
714
+ function renderNodes(nodes) {
715
+ const computed = import_react10.default.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
716
+ if (title && !computed.find((tag) => tag.startsWith("<title"))) {
717
+ computed.push(`<title inertia>${title}</title>`);
718
+ }
719
+ return computed;
720
+ }
721
+ if (isServer) {
722
+ provider.update(renderNodes(children));
723
+ }
724
+ return null;
725
+ };
726
+ var Head_default = Head;
727
+
728
+ // src/Link.ts
729
+ var import_core6 = require("@inertiajs/core");
730
+ var import_react11 = require("react");
731
+ var noop2 = () => void 0;
732
+ var Link = (0, import_react11.forwardRef)(
733
+ ({
734
+ children,
735
+ as = "a",
736
+ data = {},
737
+ href = "",
738
+ method = "get",
739
+ preserveScroll = false,
740
+ preserveState = null,
741
+ replace = false,
742
+ only = [],
743
+ except = [],
744
+ headers = {},
745
+ queryStringArrayFormat = "brackets",
746
+ async = false,
747
+ onClick = noop2,
748
+ onCancelToken = noop2,
749
+ onBefore = noop2,
750
+ onStart = noop2,
751
+ onProgress = noop2,
752
+ onFinish = noop2,
753
+ onCancel = noop2,
754
+ onSuccess = noop2,
755
+ onError = noop2,
756
+ onPrefetching = noop2,
757
+ onPrefetched = noop2,
758
+ prefetch = false,
759
+ cacheFor = 0,
760
+ ...props
761
+ }, ref) => {
762
+ const [inFlightCount, setInFlightCount] = (0, import_react11.useState)(0);
763
+ const hoverTimeout = (0, import_react11.useRef)(null);
764
+ const _method = (0, import_react11.useMemo)(() => {
765
+ return typeof href === "object" ? href.method : method.toLowerCase();
766
+ }, [href, method]);
767
+ const _as = (0, import_react11.useMemo)(() => {
768
+ if (typeof as !== "string") {
769
+ return as;
770
+ }
771
+ return _method !== "get" ? "button" : as.toLowerCase();
772
+ }, [as, _method]);
773
+ const mergeDataArray = (0, import_react11.useMemo)(
774
+ () => (0, import_core6.mergeDataIntoQueryString)(_method, typeof href === "object" ? href.url : href, data, queryStringArrayFormat),
775
+ [href, _method, data, queryStringArrayFormat]
776
+ );
777
+ const url = (0, import_react11.useMemo)(() => mergeDataArray[0], [mergeDataArray]);
778
+ const _data = (0, import_react11.useMemo)(() => mergeDataArray[1], [mergeDataArray]);
779
+ const baseParams = (0, import_react11.useMemo)(
780
+ () => ({
781
+ data: _data,
782
+ method: _method,
783
+ preserveScroll,
784
+ preserveState: preserveState ?? _method !== "get",
785
+ replace,
786
+ only,
787
+ except,
788
+ headers,
789
+ async
790
+ }),
791
+ [_data, _method, preserveScroll, preserveState, replace, only, except, headers, async]
792
+ );
793
+ const visitParams = (0, import_react11.useMemo)(
794
+ () => ({
795
+ ...baseParams,
796
+ onCancelToken,
797
+ onBefore,
798
+ onStart(visit) {
799
+ setInFlightCount((count) => count + 1);
800
+ onStart(visit);
801
+ },
802
+ onProgress,
803
+ onFinish(visit) {
804
+ setInFlightCount((count) => count - 1);
805
+ onFinish(visit);
806
+ },
807
+ onCancel,
808
+ onSuccess,
809
+ onError
810
+ }),
811
+ [baseParams, onCancelToken, onBefore, onStart, onProgress, onFinish, onCancel, onSuccess, onError]
812
+ );
813
+ const prefetchModes = (0, import_react11.useMemo)(
814
+ () => {
815
+ if (prefetch === true) {
816
+ return ["hover"];
817
+ }
818
+ if (prefetch === false) {
819
+ return [];
820
+ }
821
+ if (Array.isArray(prefetch)) {
822
+ return prefetch;
823
+ }
824
+ return [prefetch];
825
+ },
826
+ Array.isArray(prefetch) ? prefetch : [prefetch]
827
+ );
828
+ const cacheForValue = (0, import_react11.useMemo)(() => {
829
+ if (cacheFor !== 0) {
830
+ return cacheFor;
831
+ }
832
+ if (prefetchModes.length === 1 && prefetchModes[0] === "click") {
833
+ return 0;
834
+ }
835
+ return 3e4;
836
+ }, [cacheFor, prefetchModes]);
837
+ const doPrefetch = (0, import_react11.useMemo)(() => {
838
+ return () => {
839
+ import_core6.router.prefetch(
840
+ url,
841
+ {
842
+ ...baseParams,
843
+ onPrefetching,
844
+ onPrefetched
845
+ },
846
+ { cacheFor: cacheForValue }
847
+ );
848
+ };
849
+ }, [url, baseParams, onPrefetching, onPrefetched, cacheForValue]);
850
+ (0, import_react11.useEffect)(() => {
851
+ return () => {
852
+ clearTimeout(hoverTimeout.current);
853
+ };
854
+ }, []);
855
+ (0, import_react11.useEffect)(() => {
856
+ if (prefetchModes.includes("mount")) {
857
+ setTimeout(() => doPrefetch());
858
+ }
859
+ }, prefetchModes);
860
+ const regularEvents = {
861
+ onClick: (event) => {
862
+ onClick(event);
863
+ if ((0, import_core6.shouldIntercept)(event)) {
864
+ event.preventDefault();
865
+ import_core6.router.visit(url, visitParams);
866
+ }
867
+ }
868
+ };
869
+ const prefetchHoverEvents = {
870
+ onMouseEnter: () => {
871
+ hoverTimeout.current = window.setTimeout(() => {
872
+ doPrefetch();
873
+ }, 75);
874
+ },
875
+ onMouseLeave: () => {
876
+ clearTimeout(hoverTimeout.current);
877
+ },
878
+ onClick: regularEvents.onClick
879
+ };
880
+ const prefetchClickEvents = {
881
+ onMouseDown: (event) => {
882
+ if ((0, import_core6.shouldIntercept)(event)) {
883
+ event.preventDefault();
884
+ doPrefetch();
885
+ }
886
+ },
887
+ onMouseUp: (event) => {
888
+ event.preventDefault();
889
+ import_core6.router.visit(url, visitParams);
890
+ },
891
+ onClick: (event) => {
892
+ onClick(event);
893
+ if ((0, import_core6.shouldIntercept)(event)) {
894
+ event.preventDefault();
895
+ }
896
+ }
897
+ };
898
+ const elProps = (0, import_react11.useMemo)(() => {
899
+ if (_as === "button") {
900
+ return { type: "button" };
901
+ }
902
+ if (_as === "a" || typeof _as !== "string") {
903
+ return { href: url };
904
+ }
905
+ return {};
906
+ }, [_as, url]);
907
+ return (0, import_react11.createElement)(
908
+ _as,
909
+ {
910
+ ...props,
911
+ ...elProps,
912
+ ref,
913
+ ...(() => {
914
+ if (prefetchModes.includes("hover")) {
915
+ return prefetchHoverEvents;
916
+ }
917
+ if (prefetchModes.includes("click")) {
918
+ return prefetchClickEvents;
919
+ }
920
+ return regularEvents;
921
+ })(),
922
+ "data-loading": inFlightCount > 0 ? "" : void 0
923
+ },
924
+ children
925
+ );
926
+ }
927
+ );
928
+ Link.displayName = "InertiaLink";
929
+ var Link_default = Link;
930
+
931
+ // src/usePoll.ts
932
+ var import_core7 = require("@inertiajs/core");
933
+ var import_react12 = require("react");
934
+ function usePoll(interval, requestOptions = {}, options = {
935
+ keepAlive: false,
936
+ autoStart: true
937
+ }) {
938
+ const pollRef = (0, import_react12.useRef)(
939
+ import_core7.router.poll(interval, requestOptions, {
940
+ ...options,
941
+ autoStart: false
942
+ })
943
+ );
944
+ (0, import_react12.useEffect)(() => {
807
945
  if (options.autoStart ?? true) {
808
946
  pollRef.current.start();
809
947
  }
@@ -816,21 +954,21 @@ function usePoll(interval, requestOptions = {}, options = {
816
954
  }
817
955
 
818
956
  // src/usePrefetch.ts
819
- var import_core7 = require("@inertiajs/core");
820
- var import_react12 = require("react");
957
+ var import_core8 = require("@inertiajs/core");
958
+ var import_react13 = require("react");
821
959
  function usePrefetch(options = {}) {
822
- const cached = typeof window === "undefined" ? null : import_core7.router.getCached(window.location.pathname, options);
823
- const inFlight = typeof window === "undefined" ? null : import_core7.router.getPrefetching(window.location.pathname, options);
824
- const [lastUpdatedAt, setLastUpdatedAt] = (0, import_react12.useState)(cached?.staleTimestamp || null);
825
- const [isPrefetching, setIsPrefetching] = (0, import_react12.useState)(inFlight !== null);
826
- const [isPrefetched, setIsPrefetched] = (0, import_react12.useState)(cached !== null);
827
- (0, import_react12.useEffect)(() => {
828
- const onPrefetchingListener = import_core7.router.on("prefetching", (e) => {
960
+ const cached = typeof window === "undefined" ? null : import_core8.router.getCached(window.location.pathname, options);
961
+ const inFlight = typeof window === "undefined" ? null : import_core8.router.getPrefetching(window.location.pathname, options);
962
+ const [lastUpdatedAt, setLastUpdatedAt] = (0, import_react13.useState)(cached?.staleTimestamp || null);
963
+ const [isPrefetching, setIsPrefetching] = (0, import_react13.useState)(inFlight !== null);
964
+ const [isPrefetched, setIsPrefetched] = (0, import_react13.useState)(cached !== null);
965
+ (0, import_react13.useEffect)(() => {
966
+ const onPrefetchingListener = import_core8.router.on("prefetching", (e) => {
829
967
  if (e.detail.visit.url.pathname === window.location.pathname) {
830
968
  setIsPrefetching(true);
831
969
  }
832
970
  });
833
- const onPrefetchedListener = import_core7.router.on("prefetched", (e) => {
971
+ const onPrefetchedListener = import_core8.router.on("prefetched", (e) => {
834
972
  if (e.detail.visit.url.pathname === window.location.pathname) {
835
973
  setIsPrefetching(false);
836
974
  setIsPrefetched(true);
@@ -846,22 +984,22 @@ function usePrefetch(options = {}) {
846
984
  lastUpdatedAt,
847
985
  isPrefetching,
848
986
  isPrefetched,
849
- flush: () => import_core7.router.flush(window.location.pathname, options)
987
+ flush: () => import_core8.router.flush(window.location.pathname, options)
850
988
  };
851
989
  }
852
990
 
853
991
  // src/WhenVisible.ts
854
- var import_core8 = require("@inertiajs/core");
855
- var import_react13 = require("react");
992
+ var import_core9 = require("@inertiajs/core");
993
+ var import_react14 = require("react");
856
994
  var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) => {
857
995
  always = always ?? false;
858
996
  as = as ?? "div";
859
997
  fallback = fallback ?? null;
860
- const [loaded, setLoaded] = (0, import_react13.useState)(false);
861
- const hasFetched = (0, import_react13.useRef)(false);
862
- const fetching = (0, import_react13.useRef)(false);
863
- const ref = (0, import_react13.useRef)(null);
864
- const getReloadParams = (0, import_react13.useCallback)(() => {
998
+ const [loaded, setLoaded] = (0, import_react14.useState)(false);
999
+ const hasFetched = (0, import_react14.useRef)(false);
1000
+ const fetching = (0, import_react14.useRef)(false);
1001
+ const ref = (0, import_react14.useRef)(null);
1002
+ const getReloadParams = (0, import_react14.useCallback)(() => {
865
1003
  if (data) {
866
1004
  return {
867
1005
  only: Array.isArray(data) ? data : [data]
@@ -872,7 +1010,7 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
872
1010
  }
873
1011
  return params;
874
1012
  }, [params, data]);
875
- (0, import_react13.useEffect)(() => {
1013
+ (0, import_react14.useEffect)(() => {
876
1014
  if (!ref.current) {
877
1015
  return;
878
1016
  }
@@ -890,7 +1028,7 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
890
1028
  hasFetched.current = true;
891
1029
  fetching.current = true;
892
1030
  const reloadParams = getReloadParams();
893
- import_core8.router.reload({
1031
+ import_core9.router.reload({
894
1032
  ...reloadParams,
895
1033
  onStart: (e) => {
896
1034
  fetching.current = true;
@@ -915,21 +1053,23 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
915
1053
  observer.disconnect();
916
1054
  };
917
1055
  }, [ref, getReloadParams, buffer]);
1056
+ const resolveChildren = () => typeof children === "function" ? children() : children;
1057
+ const resolveFallback = () => typeof fallback === "function" ? fallback() : fallback;
918
1058
  if (always || !loaded) {
919
- return (0, import_react13.createElement)(
1059
+ return (0, import_react14.createElement)(
920
1060
  as,
921
1061
  {
922
1062
  props: null,
923
1063
  ref
924
1064
  },
925
- loaded ? children : fallback
1065
+ loaded ? resolveChildren() : resolveFallback()
926
1066
  );
927
1067
  }
928
- return loaded ? children : null;
1068
+ return loaded ? resolveChildren() : null;
929
1069
  };
930
1070
  WhenVisible.displayName = "InertiaWhenVisible";
931
1071
  var WhenVisible_default = WhenVisible;
932
1072
 
933
1073
  // src/index.ts
934
- var router3 = import_core9.router;
1074
+ var router3 = import_core10.router;
935
1075
  //# sourceMappingURL=index.js.map