@atomico/hooks - npm Package Compare versions

Comparing version 3.25.1 to 3.26.0

package.json

 {
   "name": "@atomico/hooks",
   "description": "Series of utilities in hooks format to extend the operation of Atomico",
-  "version": "3.25.1",
+  "version": "3.26.0",
   "type": "module",
@@ -6,0 +6,0 @@ "workspaces": [

src/use-router/src/matches.js

@@ -26,3 +26,3 @@ import { createMatch, getParts, searchParams } from "@uppercod/exp-route";
     if (params) {
-      return [routes[route](params, search), currentPath, params, search];
+      return [routes[route](params, search), path, params, search];
     }
@@ -29,0 +29,0 @@ }

src/use-router/use-router.js

@@ -6,15 +6,16 @@ import { useState, useEffect } from "atomico";
 import { addListener } from "../use-listener/use-listener";
+import { useCurrentValue } from "../use-current-value/use-current-value";
 
-/**@type {InternalState} */
 const DefaultState = {};
-
 /**
+ * @template T
  * allows you to listen to only one route
  * @param {import("./src/matches").Routes} routes
+ * @returns {[T, StringPath, ParamsPath, SearchPath]}
  */
 export function useRouter(routes) {
   const [state, setState] = useState(DefaultState);
+  const refRoutes = useCurrentValue(routes);
 
   useEffect(() => {
-    if (!routes) return;
     // Returns to the default state to recycle the routes object
@@ -29,3 +30,3 @@ setState(DefaultState);
               path,
-              result: matches(routes, path),
+              result: matches(refRoutes.current, path),
             }
@@ -39,11 +40,13 @@ : current;
     return listener(reduce);
-  }, [routes]);
+  }, Object.keys(routes));
 
-  return state.result;
+  return state.result || [];
 }
 
 /**
+ * @template T
  * allows you to listen to only one route
  * @param {string} path
- * @param {import("./src/matches").RouterCallback} callback
+ * @param {import("./src/matches").RouterCallback} [callback]
+ * @returns {[T, StringPath, ParamsPath, SearchPath]}
  */
@@ -109,1 +112,13 @@ export function useRoute(path, callback = (param) => param) {
  */
+
+/**
+ * @typedef {string} StringPath
+ */
+
+/**
+ * @typedef {Object<string,string>} ParamsPath
+ */
+
+/**
+ * @typedef {Object<string,string>} SearchPath
+ */

src/use-router/use-router.test.js

@@ -14,3 +14,3 @@ import { expect } from "@esm-bundle/chai";
     } else {
-      expect(result).to.undefined;
+      expect(result).to.deep.equal([]);
     }
@@ -22,2 +22,4 @@ }
   hooks.cleanEffects()();
+
+  hooks.load(load);
 });
@@ -24,0 +26,0 @@

types/use-router/use-router.d.ts

 /**
+ * @template T
  * allows you to listen to only one route
  * @param {import("./src/matches").Routes} routes
+ * @returns {[T, StringPath, ParamsPath, SearchPath]}
  */
-export function useRouter(routes: import("./src/matches").Routes): any;
+export function useRouter<T>(routes: import("./src/matches").Routes): [T, string, {
+    [x: string]: string;
+}, {
+    [x: string]: string;
+}];
 /**
+ * @template T
  * allows you to listen to only one route
  * @param {string} path
- * @param {import("./src/matches").RouterCallback} callback
+ * @param {import("./src/matches").RouterCallback} [callback]
+ * @returns {[T, StringPath, ParamsPath, SearchPath]}
  */
-export function useRoute(path: string, callback?: import("./src/matches").RouterCallback): any;
+export function useRoute<T>(path: string, callback?: import("./src/matches.js").RouterCallback | undefined): [T, string, {
+    [x: string]: string;
+}, {
+    [x: string]: string;
+}];
 /**
@@ -39,2 +51,9 @@ * Create a match function to manually compare route matches,
 };
+export type StringPath = string;
+export type ParamsPath = {
+    [x: string]: string;
+};
+export type SearchPath = {
+    [x: string]: string;
+};
 export { redirect, getPath } from "./src/history.js";

No alert changes

Improved metrics

Total package byte prevSize

76453

increased by1.14%

Lines of code

2283

increased by1.47%

No dependency changes