@inertiajs/react 2.0.17 → 2.1.0

package/dist/index.esm.js

@@ -199,333 +199,71 @@ var Deferred = ({ children, data, fallback }) => {
   useEffect2(() => {
     setLoaded(keys.every((key) => pageProps[key] !== void 0));
   }, [pageProps, keys]);
-  return loaded ? children : fallback;
+  if (loaded) {
+    return typeof children === "function" ? children() : children;
+  }
+  return typeof fallback === "function" ? fallback() : fallback;
 };
 Deferred.displayName = "InertiaDeferred";
 var Deferred_default = Deferred;
 
-// src/Head.ts
-import { escape } from "es-toolkit";
-import React, { useContext as useContext2, useEffect as useEffect3, useMemo as useMemo3 } from "react";
-var Head = function({ children, title }) {
-  const headManager = useContext2(HeadContext_default);
-  const provider = useMemo3(() => headManager.createProvider(), [headManager]);
-  const isServer = typeof window === "undefined";
-  useEffect3(() => {
-    provider.reconnect();
-    provider.update(renderNodes(children));
-    return () => {
-      provider.disconnect();
-    };
-  }, [provider, children, title]);
-  function isUnaryTag(node) {
-    return [
-      "area",
-      "base",
-      "br",
-      "col",
-      "embed",
-      "hr",
-      "img",
-      "input",
-      "keygen",
-      "link",
-      "meta",
-      "param",
-      "source",
-      "track",
-      "wbr"
-    ].indexOf(node.type) > -1;
-  }
-  function renderTagStart(node) {
-    const attrs = Object.keys(node.props).reduce((carry, name) => {
-      if (["head-key", "children", "dangerouslySetInnerHTML"].includes(name)) {
-        return carry;
-      }
-      const value = String(node.props[name]);
-      if (value === "") {
-        return carry + ` ${name}`;
-      } else {
-        return carry + ` ${name}="${escape(value)}"`;
-      }
-    }, "");
-    return `<${node.type}${attrs}>`;
-  }
-  function renderTagChildren(node) {
-    return typeof node.props.children === "string" ? node.props.children : node.props.children.reduce((html, child) => html + renderTag(child), "");
-  }
-  function renderTag(node) {
-    let html = renderTagStart(node);
-    if (node.props.children) {
-      html += renderTagChildren(node);
-    }
-    if (node.props.dangerouslySetInnerHTML) {
-      html += node.props.dangerouslySetInnerHTML.__html;
-    }
-    if (!isUnaryTag(node)) {
-      html += `</${node.type}>`;
-    }
-    return html;
-  }
-  function ensureNodeHasInertiaProp(node) {
-    return React.cloneElement(node, {
-      inertia: node.props["head-key"] !== void 0 ? node.props["head-key"] : ""
-    });
-  }
-  function renderNode(node) {
-    return renderTag(ensureNodeHasInertiaProp(node));
-  }
-  function renderNodes(nodes) {
-    const computed = React.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
-    if (title && !computed.find((tag) => tag.startsWith("<title"))) {
-      computed.push(`<title inertia>${title}</title>`);
-    }
-    return computed;
-  }
-  if (isServer) {
-    provider.update(renderNodes(children));
-  }
-  return null;
-};
-var Head_default = Head;
-
-// src/Link.ts
+// src/Form.ts
 import {
-  mergeDataIntoQueryString,
-  router as router4,
-  shouldIntercept
+  formDataToObject,
+  mergeDataIntoQueryString
 } from "@inertiajs/core";
-import { createElement as createElement3, forwardRef, useEffect as useEffect4, useMemo as useMemo4, useRef, useState as useState3 } from "react";
-var noop = () => void 0;
-var Link = forwardRef(
-  ({
-    children,
-    as = "a",
-    data = {},
-    href,
-    method = "get",
-    preserveScroll = false,
-    preserveState = null,
-    replace = false,
-    only = [],
-    except = [],
-    headers = {},
-    queryStringArrayFormat = "brackets",
-    async = false,
-    onClick = noop,
-    onCancelToken = noop,
-    onBefore = noop,
-    onStart = noop,
-    onProgress = noop,
-    onFinish = noop,
-    onCancel = noop,
-    onSuccess = noop,
-    onError = noop,
-    prefetch = false,
-    cacheFor = 0,
-    ...props
-  }, ref) => {
-    const [inFlightCount, setInFlightCount] = useState3(0);
-    const hoverTimeout = useRef(null);
-    const _method = useMemo4(() => {
-      return typeof href === "object" ? href.method : method.toLowerCase();
-    }, [href, method]);
-    const _as = useMemo4(() => {
-      as = as.toLowerCase();
-      return _method !== "get" ? "button" : as;
-    }, [as, _method]);
-    const mergeDataArray = useMemo4(
-      () => mergeDataIntoQueryString(
-        _method,
-        typeof href === "object" ? href.url : href || "",
-        data,
-        queryStringArrayFormat
-      ),
-      [href, _method, data, queryStringArrayFormat]
-    );
-    const url = useMemo4(() => mergeDataArray[0], [mergeDataArray]);
-    const _data = useMemo4(() => mergeDataArray[1], [mergeDataArray]);
-    const baseParams = useMemo4(
-      () => ({
-        data: _data,
-        method: _method,
-        preserveScroll,
-        preserveState: preserveState ?? _method !== "get",
-        replace,
-        only,
-        except,
-        headers,
-        async
-      }),
-      [_data, _method, preserveScroll, preserveState, replace, only, except, headers, async]
-    );
-    const visitParams = useMemo4(
-      () => ({
-        ...baseParams,
-        onCancelToken,
-        onBefore,
-        onStart(event) {
-          setInFlightCount((count) => count + 1);
-          onStart(event);
-        },
-        onProgress,
-        onFinish(event) {
-          setInFlightCount((count) => count - 1);
-          onFinish(event);
-        },
-        onCancel,
-        onSuccess,
-        onError
-      }),
-      [baseParams, onCancelToken, onBefore, onStart, onProgress, onFinish, onCancel, onSuccess, onError]
-    );
-    const doPrefetch = () => {
-      router4.prefetch(url, baseParams, { cacheFor: cacheForValue });
-    };
-    const prefetchModes = useMemo4(
-      () => {
-        if (prefetch === true) {
-          return ["hover"];
-        }
-        if (prefetch === false) {
-          return [];
-        }
-        if (Array.isArray(prefetch)) {
-          return prefetch;
-        }
-        return [prefetch];
-      },
-      Array.isArray(prefetch) ? prefetch : [prefetch]
-    );
-    const cacheForValue = useMemo4(() => {
-      if (cacheFor !== 0) {
-        return cacheFor;
-      }
-      if (prefetchModes.length === 1 && prefetchModes[0] === "click") {
-        return 0;
-      }
-      return 3e4;
-    }, [cacheFor, prefetchModes]);
-    useEffect4(() => {
-      return () => {
-        clearTimeout(hoverTimeout.current);
-      };
-    }, []);
-    useEffect4(() => {
-      if (prefetchModes.includes("mount")) {
-        setTimeout(() => doPrefetch());
-      }
-    }, prefetchModes);
-    const regularEvents = {
-      onClick: (event) => {
-        onClick(event);
-        if (shouldIntercept(event)) {
-          event.preventDefault();
-          router4.visit(url, visitParams);
-        }
-      }
-    };
-    const prefetchHoverEvents = {
-      onMouseEnter: () => {
-        hoverTimeout.current = window.setTimeout(() => {
-          doPrefetch();
-        }, 75);
-      },
-      onMouseLeave: () => {
-        clearTimeout(hoverTimeout.current);
-      },
-      onClick: regularEvents.onClick
-    };
-    const prefetchClickEvents = {
-      onMouseDown: (event) => {
-        if (shouldIntercept(event)) {
-          event.preventDefault();
-          doPrefetch();
-        }
-      },
-      onMouseUp: (event) => {
-        event.preventDefault();
-        router4.visit(url, visitParams);
-      },
-      onClick: (event) => {
-        onClick(event);
-        if (shouldIntercept(event)) {
-          event.preventDefault();
-        }
-      }
-    };
-    const elProps = useMemo4(
-      () => ({
-        a: { href: url },
-        button: { type: "button" }
-      }),
-      [url]
-    );
-    return createElement3(
-      _as,
-      {
-        ...props,
-        ...elProps[_as] || {},
-        ref,
-        ...(() => {
-          if (prefetchModes.includes("hover")) {
-            return prefetchHoverEvents;
-          }
-          if (prefetchModes.includes("click")) {
-            return prefetchClickEvents;
-          }
-          return regularEvents;
-        })(),
-        "data-loading": inFlightCount > 0 ? "" : void 0
-      },
-      children
-    );
-  }
-);
-Link.displayName = "InertiaLink";
-var Link_default = Link;
+import { isEqual as isEqual2 } from "es-toolkit";
+import {
+  createElement as createElement3,
+  forwardRef,
+  useEffect as useEffect5,
+  useImperativeHandle,
+  useMemo as useMemo4,
+  useRef as useRef2,
+  useState as useState5
+} from "react";
 
 // src/useForm.ts
 import {
-  router as router6
+  router as router5
 } from "@inertiajs/core";
 import { cloneDeep, isEqual } from "es-toolkit";
 import { get, has, set } from "es-toolkit/compat";
-import { useCallback, useEffect as useEffect6, useLayoutEffect, useMemo as useMemo5, useRef as useRef2, useState as useState5 } from "react";
+import { useCallback, useEffect as useEffect4, useLayoutEffect, useMemo as useMemo3, useRef, useState as useState4 } from "react";
 
 // src/useRemember.ts
-import { router as router5 } from "@inertiajs/core";
-import { useEffect as useEffect5, useState as useState4 } from "react";
+import { router as router4 } from "@inertiajs/core";
+import { useEffect as useEffect3, useState as useState3 } from "react";
 function useRemember(initialState, key) {
-  const [state, setState] = useState4(() => {
-    const restored = router5.restore(key);
+  const [state, setState] = useState3(() => {
+    const restored = router4.restore(key);
     return restored !== void 0 ? restored : initialState;
   });
-  useEffect5(() => {
-    router5.remember(state, key);
+  useEffect3(() => {
+    router4.remember(state, key);
   }, [state, key]);
   return [state, setState];
 }
 
 // src/useForm.ts
 function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
-  const isMounted = useRef2(null);
+  const isMounted = useRef(null);
   const rememberKey = typeof rememberKeyOrInitialValues === "string" ? rememberKeyOrInitialValues : null;
-  const [defaults, setDefaults] = useState5(
+  const [defaults, setDefaults] = useState4(
     (typeof rememberKeyOrInitialValues === "string" ? maybeInitialValues : rememberKeyOrInitialValues) || {}
   );
-  const cancelToken = useRef2(null);
-  const recentlySuccessfulTimeoutId = useRef2(null);
-  const [data, setData] = rememberKey ? useRemember(defaults, `${rememberKey}:data`) : useState5(defaults);
-  const [errors, setErrors] = rememberKey ? useRemember({}, `${rememberKey}:errors`) : useState5({});
-  const [hasErrors, setHasErrors] = useState5(false);
-  const [processing, setProcessing] = useState5(false);
-  const [progress, setProgress] = useState5(null);
-  const [wasSuccessful, setWasSuccessful] = useState5(false);
-  const [recentlySuccessful, setRecentlySuccessful] = useState5(false);
-  const transform = useRef2((data2) => data2);
-  const isDirty = useMemo5(() => !isEqual(data, defaults), [data, defaults]);
-  useEffect6(() => {
+  const cancelToken = useRef(null);
+  const recentlySuccessfulTimeoutId = useRef(null);
+  const [data, setData] = rememberKey ? useRemember(defaults, `${rememberKey}:data`) : useState4(defaults);
+  const [errors, setErrors] = rememberKey ? useRemember({}, `${rememberKey}:errors`) : useState4({});
+  const [hasErrors, setHasErrors] = useState4(false);
+  const [processing, setProcessing] = useState4(false);
+  const [progress, setProgress] = useState4(null);
+  const [wasSuccessful, setWasSuccessful] = useState4(false);
+  const [recentlySuccessful, setRecentlySuccessful] = useState4(false);
+  const transform = useRef((data2) => data2);
+  const isDirty = useMemo3(() => !isEqual(data, defaults), [data, defaults]);
+  useEffect4(() => {
     isMounted.current = true;
     return () => {
       isMounted.current = false;
@@ -616,9 +354,9 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
         }
       };
       if (method === "delete") {
-        router6.delete(url, { ..._options, data: transform.current(data) });
+        router5.delete(url, { ..._options, data: transform.current(data) });
       } else {
-        router6[method](url, transform.current(data), _options);
+        router5[method](url, transform.current(data), _options);
       }
     },
     [data, setErrors, transform]
@@ -635,7 +373,7 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
     },
     [setData]
   );
-  const [dataAsDefaults, setDataAsDefaults] = useState5(false);
+  const [dataAsDefaults, setDataAsDefaults] = useState4(false);
   const setDefaultsFunction = useCallback(
     (fieldOrFields, maybeValue) => {
       if (typeof fieldOrFields === "undefined") {
@@ -753,20 +491,419 @@ function useForm(rememberKeyOrInitialValues, maybeInitialValues) {
   };
 }
 
-// src/usePoll.ts
-import { router as router7 } from "@inertiajs/core";
-import { useEffect as useEffect7, useRef as useRef3 } from "react";
-function usePoll(interval, requestOptions = {}, options = {
-  keepAlive: false,
-  autoStart: true
+// src/Form.ts
+var noop = () => void 0;
+var Form = forwardRef(
+  ({
+    action = "",
+    method = "get",
+    headers = {},
+    queryStringArrayFormat = "brackets",
+    errorBag = null,
+    showProgress = true,
+    transform = (data) => data,
+    options = {},
+    onStart = noop,
+    onProgress = noop,
+    onFinish = noop,
+    onBefore = noop,
+    onCancel = noop,
+    onSuccess = noop,
+    onError = noop,
+    onCancelToken = noop,
+    children,
+    ...props
+  }, ref) => {
+    const form = useForm({});
+    const formElement = useRef2(null);
+    const resolvedMethod = useMemo4(() => {
+      return typeof action === "object" ? action.method : method.toLowerCase();
+    }, [action, method]);
+    const [isDirty, setIsDirty] = useState5(false);
+    const defaultValues = useRef2({});
+    const getData = () => {
+      return formDataToObject(new FormData(formElement.current));
+    };
+    const updateDirtyState = (event) => setIsDirty(event.type === "reset" ? false : !isEqual2(getData(), defaultValues.current));
+    useEffect5(() => {
+      defaultValues.current = getData();
+      const formEvents = ["input", "change", "reset"];
+      formEvents.forEach((e) => formElement.current.addEventListener(e, updateDirtyState));
+      return () => formEvents.forEach((e) => formElement.current?.removeEventListener(e, updateDirtyState));
+    }, []);
+    const submit = () => {
+      const [url, _data] = mergeDataIntoQueryString(
+        resolvedMethod,
+        typeof action === "object" ? action.url : action,
+        getData(),
+        queryStringArrayFormat
+      );
+      const submitOptions = {
+        headers,
+        errorBag,
+        showProgress,
+        onCancelToken,
+        onBefore,
+        onStart,
+        onProgress,
+        onFinish,
+        onCancel,
+        onSuccess,
+        onError,
+        ...options
+      };
+      form.transform(() => transform(_data));
+      form.submit(resolvedMethod, url, submitOptions);
+    };
+    useImperativeHandle(
+      ref,
+      () => ({
+        errors: form.errors,
+        hasErrors: form.hasErrors,
+        processing: form.processing,
+        progress: form.progress,
+        wasSuccessful: form.wasSuccessful,
+        recentlySuccessful: form.recentlySuccessful,
+        clearErrors: form.clearErrors,
+        resetAndClearErrors: form.resetAndClearErrors,
+        setError: form.setError,
+        isDirty,
+        reset: () => formElement.current?.reset(),
+        submit
+      }),
+      [form, isDirty, submit]
+    );
+    return createElement3(
+      "form",
+      {
+        ...props,
+        ref: formElement,
+        action: typeof action === "object" ? action.url : action,
+        method: resolvedMethod,
+        onSubmit: (event) => {
+          event.preventDefault();
+          submit();
+        }
+      },
+      typeof children === "function" ? children({
+        errors: form.errors,
+        hasErrors: form.hasErrors,
+        processing: form.processing,
+        progress: form.progress,
+        wasSuccessful: form.wasSuccessful,
+        recentlySuccessful: form.recentlySuccessful,
+        setError: form.setError,
+        clearErrors: form.clearErrors,
+        resetAndClearErrors: form.resetAndClearErrors,
+        isDirty,
+        reset: () => formElement.current?.reset(),
+        submit
+      }) : children
+    );
+  }
+);
+Form.displayName = "InertiaForm";
+var Form_default = Form;
+
+// src/Head.ts
+import { escape } from "es-toolkit";
+import React, { useContext as useContext2, useEffect as useEffect6, useMemo as useMemo5 } from "react";
+var Head = function({ children, title }) {
+  const headManager = useContext2(HeadContext_default);
+  const provider = useMemo5(() => headManager.createProvider(), [headManager]);
+  const isServer = typeof window === "undefined";
+  useEffect6(() => {
+    provider.reconnect();
+    provider.update(renderNodes(children));
+    return () => {
+      provider.disconnect();
+    };
+  }, [provider, children, title]);
+  function isUnaryTag(node) {
+    return [
+      "area",
+      "base",
+      "br",
+      "col",
+      "embed",
+      "hr",
+      "img",
+      "input",
+      "keygen",
+      "link",
+      "meta",
+      "param",
+      "source",
+      "track",
+      "wbr"
+    ].indexOf(node.type) > -1;
+  }
+  function renderTagStart(node) {
+    const attrs = Object.keys(node.props).reduce((carry, name) => {
+      if (["head-key", "children", "dangerouslySetInnerHTML"].includes(name)) {
+        return carry;
+      }
+      const value = String(node.props[name]);
+      if (value === "") {
+        return carry + ` ${name}`;
+      } else {
+        return carry + ` ${name}="${escape(value)}"`;
+      }
+    }, "");
+    return `<${node.type}${attrs}>`;
+  }
+  function renderTagChildren(node) {
+    return typeof node.props.children === "string" ? node.props.children : node.props.children.reduce((html, child) => html + renderTag(child), "");
+  }
+  function renderTag(node) {
+    let html = renderTagStart(node);
+    if (node.props.children) {
+      html += renderTagChildren(node);
+    }
+    if (node.props.dangerouslySetInnerHTML) {
+      html += node.props.dangerouslySetInnerHTML.__html;
+    }
+    if (!isUnaryTag(node)) {
+      html += `</${node.type}>`;
+    }
+    return html;
+  }
+  function ensureNodeHasInertiaProp(node) {
+    return React.cloneElement(node, {
+      inertia: node.props["head-key"] !== void 0 ? node.props["head-key"] : ""
+    });
+  }
+  function renderNode(node) {
+    return renderTag(ensureNodeHasInertiaProp(node));
+  }
+  function renderNodes(nodes) {
+    const computed = React.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
+    if (title && !computed.find((tag) => tag.startsWith("<title"))) {
+      computed.push(`<title inertia>${title}</title>`);
+    }
+    return computed;
+  }
+  if (isServer) {
+    provider.update(renderNodes(children));
+  }
+  return null;
+};
+var Head_default = Head;
+
+// src/Link.ts
+import {
+  mergeDataIntoQueryString as mergeDataIntoQueryString2,
+  router as router6,
+  shouldIntercept
+} from "@inertiajs/core";
+import { createElement as createElement4, forwardRef as forwardRef2, useEffect as useEffect7, useMemo as useMemo6, useRef as useRef3, useState as useState6 } from "react";
+var noop2 = () => void 0;
+var Link = forwardRef2(
+  ({
+    children,
+    as = "a",
+    data = {},
+    href,
+    method = "get",
+    preserveScroll = false,
+    preserveState = null,
+    replace = false,
+    only = [],
+    except = [],
+    headers = {},
+    queryStringArrayFormat = "brackets",
+    async = false,
+    onClick = noop2,
+    onCancelToken = noop2,
+    onBefore = noop2,
+    onStart = noop2,
+    onProgress = noop2,
+    onFinish = noop2,
+    onCancel = noop2,
+    onSuccess = noop2,
+    onError = noop2,
+    prefetch = false,
+    cacheFor = 0,
+    ...props
+  }, ref) => {
+    const [inFlightCount, setInFlightCount] = useState6(0);
+    const hoverTimeout = useRef3(null);
+    const _method = useMemo6(() => {
+      return typeof href === "object" ? href.method : method.toLowerCase();
+    }, [href, method]);
+    const _as = useMemo6(() => {
+      if (typeof as !== "string") {
+        return as;
+      }
+      return _method !== "get" ? "button" : as.toLowerCase();
+    }, [as, _method]);
+    const mergeDataArray = useMemo6(
+      () => mergeDataIntoQueryString2(
+        _method,
+        typeof href === "object" ? href.url : href || "",
+        data,
+        queryStringArrayFormat
+      ),
+      [href, _method, data, queryStringArrayFormat]
+    );
+    const url = useMemo6(() => mergeDataArray[0], [mergeDataArray]);
+    const _data = useMemo6(() => mergeDataArray[1], [mergeDataArray]);
+    const baseParams = useMemo6(
+      () => ({
+        data: _data,
+        method: _method,
+        preserveScroll,
+        preserveState: preserveState ?? _method !== "get",
+        replace,
+        only,
+        except,
+        headers,
+        async
+      }),
+      [_data, _method, preserveScroll, preserveState, replace, only, except, headers, async]
+    );
+    const visitParams = useMemo6(
+      () => ({
+        ...baseParams,
+        onCancelToken,
+        onBefore,
+        onStart(event) {
+          setInFlightCount((count) => count + 1);
+          onStart(event);
+        },
+        onProgress,
+        onFinish(event) {
+          setInFlightCount((count) => count - 1);
+          onFinish(event);
+        },
+        onCancel,
+        onSuccess,
+        onError
+      }),
+      [baseParams, onCancelToken, onBefore, onStart, onProgress, onFinish, onCancel, onSuccess, onError]
+    );
+    const doPrefetch = () => {
+      router6.prefetch(url, baseParams, { cacheFor: cacheForValue });
+    };
+    const prefetchModes = useMemo6(
+      () => {
+        if (prefetch === true) {
+          return ["hover"];
+        }
+        if (prefetch === false) {
+          return [];
+        }
+        if (Array.isArray(prefetch)) {
+          return prefetch;
+        }
+        return [prefetch];
+      },
+      Array.isArray(prefetch) ? prefetch : [prefetch]
+    );
+    const cacheForValue = useMemo6(() => {
+      if (cacheFor !== 0) {
+        return cacheFor;
+      }
+      if (prefetchModes.length === 1 && prefetchModes[0] === "click") {
+        return 0;
+      }
+      return 3e4;
+    }, [cacheFor, prefetchModes]);
+    useEffect7(() => {
+      return () => {
+        clearTimeout(hoverTimeout.current);
+      };
+    }, []);
+    useEffect7(() => {
+      if (prefetchModes.includes("mount")) {
+        setTimeout(() => doPrefetch());
+      }
+    }, prefetchModes);
+    const regularEvents = {
+      onClick: (event) => {
+        onClick(event);
+        if (shouldIntercept(event)) {
+          event.preventDefault();
+          router6.visit(url, visitParams);
+        }
+      }
+    };
+    const prefetchHoverEvents = {
+      onMouseEnter: () => {
+        hoverTimeout.current = window.setTimeout(() => {
+          doPrefetch();
+        }, 75);
+      },
+      onMouseLeave: () => {
+        clearTimeout(hoverTimeout.current);
+      },
+      onClick: regularEvents.onClick
+    };
+    const prefetchClickEvents = {
+      onMouseDown: (event) => {
+        if (shouldIntercept(event)) {
+          event.preventDefault();
+          doPrefetch();
+        }
+      },
+      onMouseUp: (event) => {
+        event.preventDefault();
+        router6.visit(url, visitParams);
+      },
+      onClick: (event) => {
+        onClick(event);
+        if (shouldIntercept(event)) {
+          event.preventDefault();
+        }
+      }
+    };
+    const elProps = useMemo6(() => {
+      if (_as === "button") {
+        return { type: "button" };
+      }
+      if (_as === "a" || typeof _as !== "string") {
+        return { href: url };
+      }
+      return {};
+    }, [_as, url]);
+    return createElement4(
+      _as,
+      {
+        ...props,
+        ...elProps,
+        ref,
+        ...(() => {
+          if (prefetchModes.includes("hover")) {
+            return prefetchHoverEvents;
+          }
+          if (prefetchModes.includes("click")) {
+            return prefetchClickEvents;
+          }
+          return regularEvents;
+        })(),
+        "data-loading": inFlightCount > 0 ? "" : void 0
+      },
+      children
+    );
+  }
+);
+Link.displayName = "InertiaLink";
+var Link_default = Link;
+
+// src/usePoll.ts
+import { router as router7 } from "@inertiajs/core";
+import { useEffect as useEffect8, useRef as useRef4 } from "react";
+function usePoll(interval, requestOptions = {}, options = {
+  keepAlive: false,
+  autoStart: true
 }) {
-  const pollRef = useRef3(
+  const pollRef = useRef4(
     router7.poll(interval, requestOptions, {
       ...options,
       autoStart: false
     })
   );
-  useEffect7(() => {
+  useEffect8(() => {
     if (options.autoStart ?? true) {
       pollRef.current.start();
     }
@@ -780,14 +917,14 @@ function usePoll(interval, requestOptions = {}, options = {
 
 // src/usePrefetch.ts
 import { router as router8 } from "@inertiajs/core";
-import { useEffect as useEffect8, useState as useState6 } from "react";
+import { useEffect as useEffect9, useState as useState7 } from "react";
 function usePrefetch(options = {}) {
   const cached = typeof window === "undefined" ? null : router8.getCached(window.location.pathname, options);
   const inFlight = typeof window === "undefined" ? null : router8.getPrefetching(window.location.pathname, options);
-  const [lastUpdatedAt, setLastUpdatedAt] = useState6(cached?.staleTimestamp || null);
-  const [isPrefetching, setIsPrefetching] = useState6(inFlight !== null);
-  const [isPrefetched, setIsPrefetched] = useState6(cached !== null);
-  useEffect8(() => {
+  const [lastUpdatedAt, setLastUpdatedAt] = useState7(cached?.staleTimestamp || null);
+  const [isPrefetching, setIsPrefetching] = useState7(inFlight !== null);
+  const [isPrefetched, setIsPrefetched] = useState7(cached !== null);
+  useEffect9(() => {
     const onPrefetchingListener = router8.on("prefetching", (e) => {
       if (e.detail.visit.url.pathname === window.location.pathname) {
         setIsPrefetching(true);
@@ -815,15 +952,15 @@ function usePrefetch(options = {}) {
 
 // src/WhenVisible.ts
 import { router as router9 } from "@inertiajs/core";
-import { createElement as createElement4, useCallback as useCallback2, useEffect as useEffect9, useRef as useRef4, useState as useState7 } from "react";
+import { createElement as createElement5, useCallback as useCallback2, useEffect as useEffect10, useRef as useRef5, useState as useState8 } from "react";
 var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) => {
   always = always ?? false;
   as = as ?? "div";
   fallback = fallback ?? null;
-  const [loaded, setLoaded] = useState7(false);
-  const hasFetched = useRef4(false);
-  const fetching = useRef4(false);
-  const ref = useRef4(null);
+  const [loaded, setLoaded] = useState8(false);
+  const hasFetched = useRef5(false);
+  const fetching = useRef5(false);
+  const ref = useRef5(null);
   const getReloadParams = useCallback2(() => {
     if (data) {
       return {
@@ -835,7 +972,7 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
     }
     return params;
   }, [params, data]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (!ref.current) {
       return;
     }
@@ -878,17 +1015,19 @@ var WhenVisible = ({ children, data, params, buffer, as, always, fallback }) =>
       observer.disconnect();
     };
   }, [ref, getReloadParams, buffer]);
+  const resolveChildren = () => typeof children === "function" ? children() : children;
+  const resolveFallback = () => typeof fallback === "function" ? fallback() : fallback;
   if (always || !loaded) {
-    return createElement4(
+    return createElement5(
       as,
       {
         props: null,
         ref
       },
-      loaded ? children : fallback
+      loaded ? resolveChildren() : resolveFallback()
     );
   }
-  return loaded ? children : null;
+  return loaded ? resolveChildren() : null;
 };
 WhenVisible.displayName = "InertiaWhenVisible";
 var WhenVisible_default = WhenVisible;
@@ -897,6 +1036,7 @@ var WhenVisible_default = WhenVisible;
 var router3 = Router;
 export {
   Deferred_default as Deferred,
+  Form_default as Form,
   Head_default as Head,
   Link_default as Link,
   WhenVisible_default as WhenVisible,