@remix-run/react - npm Package Compare versions

Comparing version 1.2.3 to 1.3.0-pre.1

_virtual/_rollupPluginBabelHelpers.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

browser.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

components.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -542,3 +542,6 @@ * Copyright (c) Remix Software Inc.
       key: "title"
-    }, value) : Array.isArray(value) ? value.map(content => isOpenGraphTag ? /*#__PURE__*/React__namespace.createElement("meta", {
+    }, value) : ["charset", "charSet"].includes(name) ? /*#__PURE__*/React__namespace.createElement("meta", {
+      key: "charset",
+      charSet: value
+    }) : Array.isArray(value) ? value.map(content => isOpenGraphTag ? /*#__PURE__*/React__namespace.createElement("meta", {
       key: name + content,
@@ -664,3 +667,3 @@ property: name,
   let formMethod = method.toLowerCase() === "get" ? "get" : "post";
-  let formAction = useFormAction(action, formMethod);
+  let formAction = useFormAction(action);
   let formRef = React__namespace.useRef();
@@ -720,7 +723,2 @@ let ref = useComposedRefs(forwardedRef, formRef); // When calling `submit` on the form element itself, we don't get data from
 FormImpl.displayName = "FormImpl";
-
-function isActionRequestMethod(method) {
-  method = method.toLowerCase();
-  return method === "post" || method === "put" || method === "patch" || method === "delete";
-}
 /**
@@ -732,4 +730,4 @@ * Resolves a `<form action>` path relative to the current route.
 
-
-function useFormAction(action = ".", method = "get") {
+function useFormAction(action = ".", // TODO: Remove method param in v2 as it's no longer needed and is a breaking change
+method = "get") {
   let {
@@ -742,3 +740,3 @@ id
 
-  if (action === "." && isIndexRoute && isActionRequestMethod(method)) {
+  if (action === "." && isIndexRoute) {
     search = search ? search.replace(/^\?/, "?index&") : "?index";
@@ -745,0 +743,0 @@ }

data.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

errorBoundaries.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/_virtual/_rollupPluginBabelHelpers.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/browser.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/components.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -518,3 +518,6 @@ * Copyright (c) Remix Software Inc.
       key: "title"
-    }, value) : Array.isArray(value) ? value.map(content => isOpenGraphTag ? /*#__PURE__*/React.createElement("meta", {
+    }, value) : ["charset", "charSet"].includes(name) ? /*#__PURE__*/React.createElement("meta", {
+      key: "charset",
+      charSet: value
+    }) : Array.isArray(value) ? value.map(content => isOpenGraphTag ? /*#__PURE__*/React.createElement("meta", {
       key: name + content,
@@ -640,3 +643,3 @@ property: name,
   let formMethod = method.toLowerCase() === "get" ? "get" : "post";
-  let formAction = useFormAction(action, formMethod);
+  let formAction = useFormAction(action);
   let formRef = React.useRef();
@@ -696,7 +699,2 @@ let ref = useComposedRefs(forwardedRef, formRef); // When calling `submit` on the form element itself, we don't get data from
 FormImpl.displayName = "FormImpl";
-
-function isActionRequestMethod(method) {
-  method = method.toLowerCase();
-  return method === "post" || method === "put" || method === "patch" || method === "delete";
-}
 /**
@@ -708,4 +706,4 @@ * Resolves a `<form action>` path relative to the current route.
 
-
-function useFormAction(action = ".", method = "get") {
+function useFormAction(action = ".", // TODO: Remove method param in v2 as it's no longer needed and is a breaking change
+method = "get") {
   let {
@@ -718,3 +716,3 @@ id
 
-  if (action === "." && isIndexRoute && isActionRequestMethod(method)) {
+  if (action === "." && isIndexRoute) {
     search = search ? search.replace(/^\?/, "?index&") : "?index";
@@ -721,0 +719,0 @@ }

esm/data.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/errorBoundaries.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/index.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/invariant.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/links.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/markup.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/routeMatching.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/routeModules.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/routes.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/scroll-restoration.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/server.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

esm/transition.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -16,2 +16,5 @@ * Copyright (c) Remix Software Inc.
 // TODO: We eventually might not want to import anything directly from `history`
+//#region Types and Utils
+////////////////////////////////////////////////////////////////////////////////
+
 class CatchValue {
@@ -26,3 +29,2 @@ constructor(status, statusText, data) {
 
-////////////////////////////////////////////////////////////////////////////////
 function isActionSubmission(submission) {
@@ -73,3 +75,7 @@ return ["POST", "PUT", "PATCH", "DELETE"].includes(submission.method);
   submission: undefined
-};
+}; //#endregion
+////////////////////////////////////////////////////////////////////////////////
+//#region createTransitionManager
+////////////////////////////////////////////////////////////////////////////////
+
 function createTransitionManager(init) {
@@ -84,2 +90,3 @@ let {
   let fetchReloadIds = new Map();
+  let fetchRedirectIds = new Set();
   let matches = matchClientRoutes(routes, init.location);
@@ -112,2 +119,8 @@
   function update(updates) {
+    if (updates.transition) {
+      if (updates.transition === IDLE_TRANSITION) {
+        pendingNavigationController = undefined;
+      }
+    }
+
     state = Object.assign({}, state, updates);
@@ -125,5 +138,10 @@ init.onChange(state);
 
+  function setFetcher(key, fetcher) {
+    state.fetchers.set(key, fetcher);
+  }
+
   function deleteFetcher(key) {
     if (fetchControllers.has(key)) abortFetcher(key);
     fetchReloadIds.delete(key);
+    fetchRedirectIds.delete(key);
     state.fetchers.delete(key);
@@ -191,4 +209,4 @@ }
           invariant(matches, "No matches found");
-          let match = matches.slice(-1)[0];
           if (fetchControllers.has(key)) abortFetcher(key);
+          let match = getFetcherRequestMatch(new URL(href, window.location.href), matches);
 
@@ -222,2 +240,27 @@ if (submission && isActionSubmission(submission)) {
 
+  function isIndexRequestUrl(url) {
+    for (let param of url.searchParams.getAll("index")) {
+      // only use bare `?index` params without a value
+      // ✅ /foo?index
+      // ✅ /foo?index&index=123
+      // ✅ /foo?index=123&index
+      // ❌ /foo?index=123
+      if (param === "") {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
+  function getFetcherRequestMatch(url, matches) {
+    let match = matches.slice(-1)[0];
+
+    if (!isIndexRequestUrl(url) && match.route.id.endsWith("/index")) {
+      return matches.slice(-2)[0];
+    }
+
+    return match;
+  }
+
   async function handleActionFetchSubmission(key, submission, match) {
@@ -231,3 +274,3 @@ let currentFetcher = state.fetchers.get(key);
     };
-    state.fetchers.set(key, fetcher);
+    setFetcher(key, fetcher);
     update({
@@ -249,10 +292,11 @@ fetchers: new Map(state.fetchers)
       };
+      fetchRedirectIds.add(key);
       init.onRedirect(result.value.location, locationState);
-      let doneFetcher = {
-        state: "idle",
-        type: "done",
-        data: result.value,
-        submission: undefined
+      let loadingFetcher = {
+        state: "loading",
+        type: "actionRedirect",
+        submission,
+        data: undefined
       };
-      state.fetchers.set(key, doneFetcher);
+      setFetcher(key, loadingFetcher);
       update({
@@ -278,3 +322,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, loadFetcher);
+    setFetcher(key, loadFetcher);
     update({
@@ -316,3 +360,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, doneFetcher);
+    setFetcher(key, doneFetcher);
     let abortedKeys = abortStaleFetchLoads(loadId);
@@ -374,3 +418,3 @@
       };
-      state.fetchers.set(key, doneFetcher);
+      setFetcher(key, doneFetcher);
     }
@@ -406,3 +450,3 @@ }
     };
-    state.fetchers.set(key, fetcher);
+    setFetcher(key, fetcher);
     update({
@@ -443,3 +487,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, doneFetcher);
+    setFetcher(key, doneFetcher);
     update({
@@ -462,3 +506,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, fetcher);
+    setFetcher(key, fetcher);
     update({
@@ -496,3 +540,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, doneFetcher);
+    setFetcher(key, doneFetcher);
     update({
@@ -799,2 +843,3 @@ fetchers: new Map(state.fetchers)
     let [catchVal, catchBoundaryId] = await findCatchAndBoundaryId(results, matches, maybeActionErrorResult);
+    markFetchRedirectsDone();
     let abortedIds = abortStaleFetchLoads(navigationLoadId);
@@ -821,5 +866,5 @@
   function abortNormalNavigation() {
-    var _pendingNavigationCon;
-
-    (_pendingNavigationCon = pendingNavigationController) === null || _pendingNavigationCon === void 0 ? void 0 : _pendingNavigationCon.abort();
+    if (pendingNavigationController) {
+      pendingNavigationController.abort();
+    }
   }
@@ -834,2 +879,18 @@
 
+  function markFetchRedirectsDone() {
+    let doneKeys = [];
+
+    for (let key of fetchRedirectIds) {
+      let fetcher = state.fetchers.get(key);
+      invariant(fetcher, `Expected fetcher: ${key}`);
+
+      if (fetcher.type === "actionRedirect") {
+        fetchRedirectIds.delete(key);
+        doneKeys.push(key);
+      }
+    }
+
+    markFetchersDone(doneKeys);
+  }
+
   return {
@@ -847,3 +908,6 @@ send,
   };
-} ////////////////////////////////////////////////////////////////////////////////
+} //#endregion
+////////////////////////////////////////////////////////////////////////////////
+//#region createTransitionManager sub-functions
+////////////////////////////////////////////////////////////////////////////////
 
@@ -1149,4 +1213,4 @@ function isIndexRequestAction(action) {
   return new URL(href, window.location.origin);
-}
+} //#endregion
 
 export { CatchValue, IDLE_FETCHER, IDLE_TRANSITION, TransitionRedirect, createTransitionManager };

index.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

invariant.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

links.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

markup.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

package.json

 {
   "name": "@remix-run/react",
   "description": "React DOM bindings for Remix",
-  "version": "1.2.3",
+  "version": "1.3.0-pre.1",
   "license": "MIT",
@@ -6,0 +6,0 @@ "repository": {

routeMatching.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

routeModules.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

routes.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

scroll-restoration.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

server.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -4,0 +4,0 @@ * Copyright (c) Remix Software Inc.

transition.d.ts

@@ -194,2 +194,8 @@ import { Action } from "history";
     };
+    LoadingActionRedirect: {
+        state: "loading";
+        type: "actionRedirect";
+        submission: ActionSubmission;
+        data: undefined;
+    };
     Loading: {
@@ -196,0 +202,0 @@ state: "loading";

transition.js

 /**
- * @remix-run/react v1.2.3
+ * @remix-run/react v1.3.0-pre.1
  *
@@ -20,2 +20,5 @@ * Copyright (c) Remix Software Inc.
 // TODO: We eventually might not want to import anything directly from `history`
+//#region Types and Utils
+////////////////////////////////////////////////////////////////////////////////
+
 class CatchValue {
@@ -30,3 +33,2 @@ constructor(status, statusText, data) {
 
-////////////////////////////////////////////////////////////////////////////////
 function isActionSubmission(submission) {
@@ -77,3 +79,7 @@ return ["POST", "PUT", "PATCH", "DELETE"].includes(submission.method);
   submission: undefined
-};
+}; //#endregion
+////////////////////////////////////////////////////////////////////////////////
+//#region createTransitionManager
+////////////////////////////////////////////////////////////////////////////////
+
 function createTransitionManager(init) {
@@ -88,2 +94,3 @@ let {
   let fetchReloadIds = new Map();
+  let fetchRedirectIds = new Set();
   let matches = routeMatching.matchClientRoutes(routes, init.location);
@@ -116,2 +123,8 @@
   function update(updates) {
+    if (updates.transition) {
+      if (updates.transition === IDLE_TRANSITION) {
+        pendingNavigationController = undefined;
+      }
+    }
+
     state = Object.assign({}, state, updates);
@@ -129,5 +142,10 @@ init.onChange(state);
 
+  function setFetcher(key, fetcher) {
+    state.fetchers.set(key, fetcher);
+  }
+
   function deleteFetcher(key) {
     if (fetchControllers.has(key)) abortFetcher(key);
     fetchReloadIds.delete(key);
+    fetchRedirectIds.delete(key);
     state.fetchers.delete(key);
@@ -195,4 +213,4 @@ }
           invariant(matches, "No matches found");
-          let match = matches.slice(-1)[0];
           if (fetchControllers.has(key)) abortFetcher(key);
+          let match = getFetcherRequestMatch(new URL(href, window.location.href), matches);
 
@@ -226,2 +244,27 @@ if (submission && isActionSubmission(submission)) {
 
+  function isIndexRequestUrl(url) {
+    for (let param of url.searchParams.getAll("index")) {
+      // only use bare `?index` params without a value
+      // ✅ /foo?index
+      // ✅ /foo?index&index=123
+      // ✅ /foo?index=123&index
+      // ❌ /foo?index=123
+      if (param === "") {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
+  function getFetcherRequestMatch(url, matches) {
+    let match = matches.slice(-1)[0];
+
+    if (!isIndexRequestUrl(url) && match.route.id.endsWith("/index")) {
+      return matches.slice(-2)[0];
+    }
+
+    return match;
+  }
+
   async function handleActionFetchSubmission(key, submission, match) {
@@ -235,3 +278,3 @@ let currentFetcher = state.fetchers.get(key);
     };
-    state.fetchers.set(key, fetcher);
+    setFetcher(key, fetcher);
     update({
@@ -253,10 +296,11 @@ fetchers: new Map(state.fetchers)
       };
+      fetchRedirectIds.add(key);
       init.onRedirect(result.value.location, locationState);
-      let doneFetcher = {
-        state: "idle",
-        type: "done",
-        data: result.value,
-        submission: undefined
+      let loadingFetcher = {
+        state: "loading",
+        type: "actionRedirect",
+        submission,
+        data: undefined
       };
-      state.fetchers.set(key, doneFetcher);
+      setFetcher(key, loadingFetcher);
       update({
@@ -282,3 +326,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, loadFetcher);
+    setFetcher(key, loadFetcher);
     update({
@@ -320,3 +364,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, doneFetcher);
+    setFetcher(key, doneFetcher);
     let abortedKeys = abortStaleFetchLoads(loadId);
@@ -378,3 +422,3 @@
       };
-      state.fetchers.set(key, doneFetcher);
+      setFetcher(key, doneFetcher);
     }
@@ -410,3 +454,3 @@ }
     };
-    state.fetchers.set(key, fetcher);
+    setFetcher(key, fetcher);
     update({
@@ -447,3 +491,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, doneFetcher);
+    setFetcher(key, doneFetcher);
     update({
@@ -466,3 +510,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, fetcher);
+    setFetcher(key, fetcher);
     update({
@@ -500,3 +544,3 @@ fetchers: new Map(state.fetchers)
     };
-    state.fetchers.set(key, doneFetcher);
+    setFetcher(key, doneFetcher);
     update({
@@ -803,2 +847,3 @@ fetchers: new Map(state.fetchers)
     let [catchVal, catchBoundaryId] = await findCatchAndBoundaryId(results, matches, maybeActionErrorResult);
+    markFetchRedirectsDone();
     let abortedIds = abortStaleFetchLoads(navigationLoadId);
@@ -825,5 +870,5 @@
   function abortNormalNavigation() {
-    var _pendingNavigationCon;
-
-    (_pendingNavigationCon = pendingNavigationController) === null || _pendingNavigationCon === void 0 ? void 0 : _pendingNavigationCon.abort();
+    if (pendingNavigationController) {
+      pendingNavigationController.abort();
+    }
   }
@@ -838,2 +883,18 @@
 
+  function markFetchRedirectsDone() {
+    let doneKeys = [];
+
+    for (let key of fetchRedirectIds) {
+      let fetcher = state.fetchers.get(key);
+      invariant(fetcher, `Expected fetcher: ${key}`);
+
+      if (fetcher.type === "actionRedirect") {
+        fetchRedirectIds.delete(key);
+        doneKeys.push(key);
+      }
+    }
+
+    markFetchersDone(doneKeys);
+  }
+
   return {
@@ -851,3 +912,6 @@ send,
   };
-} ////////////////////////////////////////////////////////////////////////////////
+} //#endregion
+////////////////////////////////////////////////////////////////////////////////
+//#region createTransitionManager sub-functions
+////////////////////////////////////////////////////////////////////////////////
 
@@ -1153,3 +1217,3 @@ function isIndexRequestAction(action) {
   return new URL(href, window.location.origin);
-}
+} //#endregion
 
@@ -1156,0 +1220,0 @@ exports.CatchValue = CatchValue;

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

253608

increased by1.42%

Lines of code

7238

increased by1.54%

Worsened metrics

Number of low quality alerts

2

increased by100%

Published versions last months

9

decreased by-18.18%

Published versions last two months

11

decreased by-26.67%

Published versions last week

1

decreased by-50%

Published versions last year

179

decreased by-4.28%

No dependency changes