@inertiajs/react 2.3.10 → 2.3.12

package/dist/index.esm.js

@@ -192,12 +192,21 @@ async function createInertiaApp({
 }
 
 // src/Deferred.ts
-import { useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
+import { useEffect as useEffect3, useMemo as useMemo2, useState as useState2 } from "react";
+
+// src/usePage.ts
+import React2 from "react";
+
+// src/react.ts
+import React, { useEffect as useEffect2, useLayoutEffect } from "react";
+function useIsomorphicLayoutEffect(effect, deps) {
+  typeof window === "undefined" ? useEffect2(effect, deps) : useLayoutEffect(effect, deps);
+}
+var isReact19 = typeof React.use === "function";
 
 // src/usePage.ts
-import React from "react";
 function usePage() {
-  const page = typeof React.use === "function" ? React.use(PageContext_default) : React.useContext(PageContext_default);
+  const page = isReact19 ? React2.use(PageContext_default) : React2.useContext(PageContext_default);
   if (!page) {
     throw new Error("usePage must be used within the Inertia component");
   }
@@ -220,7 +229,7 @@ var Deferred = ({ children, data, fallback }) => {
   const [loaded, setLoaded] = useState2(false);
   const pageProps = usePage().props;
   const keys = useMemo2(() => Array.isArray(data) ? data : [data], [data]);
-  useEffect2(() => {
+  useEffect3(() => {
     const removeListener = router3.on("start", (e) => {
       const isPartialVisit = e.detail.visit.only.length > 0 || e.detail.visit.except.length > 0;
       const isReloadingKey = e.detail.visit.only.find((key) => keys.includes(key));
@@ -232,10 +241,11 @@ var Deferred = ({ children, data, fallback }) => {
       removeListener();
     };
   }, []);
-  useEffect2(() => {
+  useEffect3(() => {
     setLoaded(keys.every((key) => pageProps[key] !== void 0));
   }, [pageProps, keys]);
-  if (loaded) {
+  const propsAreDefined = useMemo2(() => keys.every((key) => pageProps[key] !== void 0), [keys, pageProps]);
+  if (loaded && propsAreDefined) {
     return typeof children === "function" ? children() : children;
   }
   return typeof fallback === "function" ? fallback() : fallback;
@@ -253,7 +263,7 @@ import {
   UseFormUtils as UseFormUtils2
 } from "@inertiajs/core";
 import { isEqual as isEqual2 } from "lodash-es";
-import React2, {
+import React3, {
   createContext as createContext3,
   createElement as createElement3,
   forwardRef,
@@ -278,12 +288,6 @@ import {
 import { cloneDeep, get, has, isEqual, set } from "lodash-es";
 import { useCallback, useEffect as useEffect5, useMemo as useMemo3, useRef, useState as useState4 } from "react";
 
-// src/react.ts
-import { useEffect as useEffect3, useLayoutEffect } from "react";
-function useIsomorphicLayoutEffect(effect, deps) {
-  typeof window === "undefined" ? useEffect3(effect, deps) : useLayoutEffect(effect, deps);
-}
-
 // src/useRemember.ts
 import { router as router4 } from "@inertiajs/core";
 import { useEffect as useEffect4, useState as useState3 } from "react";
@@ -397,7 +401,9 @@ function useForm(...args) {
           if (isMounted.current) {
             setProcessing(false);
             setProgress(null);
-            setError(errors2);
+            setErrors(errors2);
+            setHasErrors(Object.keys(errors2).length > 0);
+            validatorRef.current?.setErrors(errors2);
           }
           if (options.onError) {
             return options.onError(errors2);
@@ -668,7 +674,7 @@ function useForm(...args) {
 
 // src/Form.ts
 var deferStateUpdate = (callback) => {
-  typeof React2.startTransition === "function" ? React2.startTransition(callback) : setTimeout(callback, 0);
+  typeof React3.startTransition === "function" ? React3.startTransition(callback) : setTimeout(callback, 0);
 };
 var noop = () => void 0;
 var FormContext = createContext3(void 0);
@@ -786,6 +792,11 @@ var Form = forwardRef(
     };
     const submit = (submitter) => {
       const [url, data] = getUrlAndData(submitter);
+      const formTarget = submitter?.getAttribute("formtarget");
+      if (formTarget === "_blank" && resolvedMethod === "get") {
+        window.open(url, "_blank");
+        return;
+      }
       const submitOptions = {
         headers,
         queryStringArrayFormat,
@@ -860,11 +871,10 @@ var Form = forwardRef(
           event.preventDefault();
           submit(event.nativeEvent.submitter);
         },
-        // Only React 19 supports passing a boolean to the `inert` attribute.
-        // To support earlier versions as well, we use the string 'true'.
-        // Unfortunately, React 19 treats an empty string as `false`.
+        // React 19 supports passing a boolean to the `inert` attribute, but shows
+        // a warning when receiving a string. Earlier versions require the string 'true'.
         // See: https://github.com/inertiajs/inertia/pull/2536
-        inert: disableWhileProcessing && form.processing && "true"
+        inert: disableWhileProcessing && form.processing && (isReact19 ? true : "true")
       },
       typeof children === "function" ? children(exposed) : children
     );
@@ -879,7 +889,7 @@ var Form_default = Form;
 
 // src/Head.ts
 import { escape } from "lodash-es";
-import React3, { useContext as useContext2, useEffect as useEffect7, useMemo as useMemo5 } from "react";
+import React4, { useContext as useContext2, useEffect as useEffect7, useMemo as useMemo5 } from "react";
 var Head = function({ children, title }) {
   const headManager = useContext2(HeadContext_default);
   const provider = useMemo5(() => headManager.createProvider(), [headManager]);
@@ -947,7 +957,7 @@ var Head = function({ children, title }) {
     return html;
   }
   function ensureNodeHasInertiaProp(node) {
-    return React3.cloneElement(node, {
+    return React4.cloneElement(node, {
       [provider.preferredAttribute()]: node.props["head-key"] !== void 0 ? node.props["head-key"] : ""
     });
   }
@@ -955,7 +965,7 @@ var Head = function({ children, title }) {
     return renderTag(ensureNodeHasInertiaProp(node));
   }
   function renderNodes(nodes) {
-    const elements = React3.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
+    const elements = React4.Children.toArray(nodes).filter((node) => node).map((node) => renderNode(node));
     if (title && !elements.find((tag) => tag.startsWith("<title"))) {
       elements.push(`<title ${provider.preferredAttribute()}>${title}</title>`);
     }
@@ -973,7 +983,7 @@ import {
   getScrollableParent,
   useInfiniteScroll
 } from "@inertiajs/core";
-import React4, {
+import React5, {
   createElement as createElement4,
   forwardRef as forwardRef2,
   useCallback as useCallback2,
@@ -1212,7 +1222,7 @@ var InfiniteScroll = forwardRef2(
         )
       );
     }
-    return createElement4(React4.Fragment, {}, ...reverse ? [...renderElements].reverse() : renderElements);
+    return createElement4(React5.Fragment, {}, ...reverse ? [...renderElements].reverse() : renderElements);
   }
 );
 InfiniteScroll.displayName = "InertiaInfiniteScroll";