@react-foundry/router 0.1.0

package/LICENSE

@@ -0,0 +1,22 @@
+The MIT License (MIT)
+
+Copyright (C) 2019-2025 Crown Copyright
+Copyright (C) 2019-2026 Daniel A.C. Martin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+of the Software, and to permit persons to whom the Software is furnished to do
+so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,48 @@
+React Foundry - Router
+======================
+
+An abstraction layer over the routers from react-router and Next.js.
+
+
+Using this package
+------------------
+
+First install the package into your project:
+
+```shell
+npm install -S @react-foundry/router
+```
+
+Then use it in your code as follows:
+
+```js
+import router from '@react-foundry/router';
+
+// WRITEME
+
+```
+
+
+Working on this package
+-----------------------
+
+Before working on this package you must install its dependencies using
+the following command:
+
+```shell
+pnpm install
+```
+
+
+### Building
+
+```shell
+npm run build
+```
+
+
+### Clean-up
+
+```shell
+npm run clean
+```

package/dist/common.d.ts

@@ -0,0 +1,11 @@
+import type { LinkProps as _LinkProps, Location as _Location, NavigateFunction } from 'react-router';
+import type { Query } from '@react-foundry/uri';
+export type LinkProps = Omit<_LinkProps, 'relative' | 'reloadDocument' | 'state' | 'unstable_viewTransition'>;
+export type Location = _Location & {
+    query: Query;
+};
+export type UseLocation = () => Location;
+export type UseNavigate = () => NavigateFunction;
+export type UseParams = () => Record<string, string | undefined>;
+export type { NavigateFunction };
+export type { NavigateOptions, To } from 'react-router';

package/dist/common.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/common.mjs

@@ -0,0 +1 @@
+export {};

package/dist/dummy.d.ts

@@ -0,0 +1,11 @@
+import type { FC } from 'react';
+import type { LinkProps, UseNavigate, UseParams } from './common';
+import type { UseIsActive } from './is-active';
+import type { UseLocation } from './location';
+export declare const needSuspense = false;
+export declare const useLocation: UseLocation;
+export declare const useIsActive: UseIsActive;
+export declare const useNavigate: UseNavigate;
+export declare const useParams: UseParams;
+export declare const Link: FC<LinkProps>;
+export type { LinkProps };

package/dist/dummy.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Link = exports.useParams = exports.useNavigate = exports.useIsActive = exports.useLocation = exports.needSuspense = void 0;
+const react_1 = require("react");
+const is_active_1 = require("./is-active");
+const location_1 = require("./location");
+exports.needSuspense = false;
+const _useLocation = () => ({
+    state: undefined,
+    key: '',
+    pathname: '',
+    search: '',
+    hash: ''
+});
+exports.useLocation = (0, location_1.makeUseLocation)(_useLocation);
+exports.useIsActive = (0, is_active_1.makeUseIsActive)(exports.useLocation);
+const useNavigate = () => () => undefined;
+exports.useNavigate = useNavigate;
+const useParams = () => ({});
+exports.useParams = useParams;
+const Link = ({ to, preventScrollReset, replace, ...attrs }) => {
+    const href = (typeof to === 'string'
+        ? to
+        : (to.pathname || '') + (to.search || '') + (to.hash || ''));
+    return (0, react_1.createElement)('a', {
+        ...attrs,
+        href
+    });
+};
+exports.Link = Link;

package/dist/dummy.mjs

@@ -0,0 +1,24 @@
+import { createElement as h } from 'react';
+import { makeUseIsActive } from './is-active';
+import { makeUseLocation } from './location';
+export const needSuspense = false;
+const _useLocation = () => ({
+    state: undefined,
+    key: '',
+    pathname: '',
+    search: '',
+    hash: ''
+});
+export const useLocation = makeUseLocation(_useLocation);
+export const useIsActive = makeUseIsActive(useLocation);
+export const useNavigate = () => () => undefined;
+export const useParams = () => ({});
+export const Link = ({ to, preventScrollReset, replace, ...attrs }) => {
+    const href = (typeof to === 'string'
+        ? to
+        : (to.pathname || '') + (to.search || '') + (to.hash || ''));
+    return h('a', {
+        ...attrs,
+        href
+    });
+};

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+import type { UseIsActive } from './is-active';
+import type { UseLocation } from './location';
+export declare const needSuspense = false;
+export declare const useLocation: UseLocation;
+export declare const useIsActive: UseIsActive;
+export { Link, useNavigate, useParams } from 'react-router';
+export type { LinkProps } from './dummy';

package/dist/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useParams = exports.useNavigate = exports.Link = exports.useIsActive = exports.useLocation = exports.needSuspense = void 0;
+const react_router_1 = require("react-router");
+const is_active_1 = require("./is-active");
+const location_1 = require("./location");
+exports.needSuspense = false;
+exports.useLocation = (0, location_1.makeUseLocation)(react_router_1.useLocation);
+exports.useIsActive = (0, is_active_1.makeUseIsActive)(exports.useLocation);
+var react_router_2 = require("react-router");
+Object.defineProperty(exports, "Link", { enumerable: true, get: function () { return react_router_2.Link; } });
+Object.defineProperty(exports, "useNavigate", { enumerable: true, get: function () { return react_router_2.useNavigate; } });
+Object.defineProperty(exports, "useParams", { enumerable: true, get: function () { return react_router_2.useParams; } });

package/dist/index.mjs

@@ -0,0 +1,7 @@
+import { useLocation as _useLocation } from 'react-router';
+import { makeUseIsActive } from './is-active';
+import { makeUseLocation } from './location';
+export const needSuspense = false;
+export const useLocation = makeUseLocation(_useLocation);
+export const useIsActive = makeUseIsActive(useLocation);
+export { Link, useNavigate, useParams } from 'react-router';

package/dist/is-active.d.ts

@@ -0,0 +1,3 @@
+import type { UseLocation } from './common';
+export type UseIsActive = () => (href: string, exact?: boolean) => boolean;
+export declare const makeUseIsActive: (useLocation: UseLocation) => UseIsActive;

package/dist/is-active.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeUseIsActive = void 0;
+const uri_1 = require("@react-foundry/uri");
+const includes = (haystack, needle) => {
+    const subIncludes = (haystack, needle) => (Array.isArray(needle) ? (needle.length === haystack.length &&
+        needle.reduce((acc, cur, idx) => acc && subIncludes(haystack[idx], cur), true)) : (typeof needle === 'object' ? (typeof haystack === 'object' &&
+        Object.keys(needle).reduce((acc, cur) => acc && subIncludes(haystack[cur], needle[cur]), true)) : (needle === haystack)));
+    return subIncludes(haystack, needle);
+};
+const makeUseIsActive = (useLocation) => () => {
+    const location = useLocation();
+    const isActive = (href, exact = true) => {
+        const target = uri_1.URI.parse(href, location.pathname);
+        const dir = (target.pathname.endsWith('/')
+            ? target.pathname
+            : target.pathname + '/');
+        const pathStart = (target.pathname === '' ||
+            location.pathname.startsWith(dir));
+        const pathMatch = (target.pathname === '' ||
+            location.pathname === target.pathname);
+        const queryMatch = includes(location.query, target.query);
+        const activeExact = !!(pathMatch && queryMatch);
+        const active = (exact
+            ? activeExact
+            : !!(activeExact || (pathStart && queryMatch)));
+        return active;
+    };
+    return isActive;
+};
+exports.makeUseIsActive = makeUseIsActive;

package/dist/is-active.mjs

@@ -0,0 +1,27 @@
+import { URI } from '@react-foundry/uri';
+const includes = (haystack, needle) => {
+    const subIncludes = (haystack, needle) => (Array.isArray(needle) ? (needle.length === haystack.length &&
+        needle.reduce((acc, cur, idx) => acc && subIncludes(haystack[idx], cur), true)) : (typeof needle === 'object' ? (typeof haystack === 'object' &&
+        Object.keys(needle).reduce((acc, cur) => acc && subIncludes(haystack[cur], needle[cur]), true)) : (needle === haystack)));
+    return subIncludes(haystack, needle);
+};
+export const makeUseIsActive = (useLocation) => () => {
+    const location = useLocation();
+    const isActive = (href, exact = true) => {
+        const target = URI.parse(href, location.pathname);
+        const dir = (target.pathname.endsWith('/')
+            ? target.pathname
+            : target.pathname + '/');
+        const pathStart = (target.pathname === '' ||
+            location.pathname.startsWith(dir));
+        const pathMatch = (target.pathname === '' ||
+            location.pathname === target.pathname);
+        const queryMatch = includes(location.query, target.query);
+        const activeExact = !!(pathMatch && queryMatch);
+        const active = (exact
+            ? activeExact
+            : !!(activeExact || (pathStart && queryMatch)));
+        return active;
+    };
+    return isActive;
+};

package/dist/location.d.ts

@@ -0,0 +1,6 @@
+import type { Location as _Location } from 'react-router';
+import type { Location, UseLocation } from './common';
+export type _UseLocation = () => _Location;
+export declare const enhanceLocation: (location: _Location) => Location;
+export declare const makeUseLocation: (useLocation: _UseLocation) => UseLocation;
+export type { UseLocation, };

package/dist/location.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeUseLocation = exports.enhanceLocation = void 0;
+const uri_1 = require("@react-foundry/uri");
+const enhanceLocation = (location) => ({
+    ...location,
+    query: (0, uri_1.qsParse)(location.search)
+});
+exports.enhanceLocation = enhanceLocation;
+const makeUseLocation = (useLocation) => () => ((0, exports.enhanceLocation)(useLocation()));
+exports.makeUseLocation = makeUseLocation;

package/dist/location.mjs

@@ -0,0 +1,6 @@
+import { qsParse } from '@react-foundry/uri';
+export const enhanceLocation = (location) => ({
+    ...location,
+    query: qsParse(location.search)
+});
+export const makeUseLocation = (useLocation) => () => (enhanceLocation(useLocation()));

package/dist/next.d.ts

@@ -0,0 +1,11 @@
+import type { FC } from 'react';
+import type { LinkProps, UseNavigate } from './common';
+import type { UseIsActive } from './is-active';
+import type { UseLocation } from './location';
+export declare const needSuspense = true;
+export declare const useLocation: UseLocation;
+export declare const useIsActive: UseIsActive;
+export declare const useNavigate: UseNavigate;
+export declare const Link: FC<LinkProps>;
+export { useParams } from 'next/navigation';
+export type { LinkProps };

package/dist/next.js

@@ -0,0 +1,83 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useParams = exports.Link = exports.useNavigate = exports.useIsActive = exports.useLocation = exports.needSuspense = void 0;
+const react_1 = require("react");
+const navigation_1 = require("next/navigation");
+const link_1 = __importDefault(require("next/link"));
+const is_active_1 = require("./is-active");
+const location_1 = require("./location");
+exports.needSuspense = true;
+const _useLocation = () => {
+    const pathname = (0, navigation_1.usePathname)();
+    const searchParams = (0, navigation_1.useSearchParams)();
+    const search = (searchParams.size
+        ? '?' + searchParams.toString()
+        : '');
+    const location = {
+        state: undefined,
+        key: '',
+        pathname,
+        search,
+        hash: ''
+    };
+    return location;
+};
+exports.useLocation = (0, location_1.makeUseLocation)(_useLocation);
+exports.useIsActive = (0, is_active_1.makeUseIsActive)(exports.useLocation);
+const useNavigate = () => {
+    const router = (0, navigation_1.useRouter)();
+    const navigate = (to, options = {}) => {
+        if (typeof to === 'number') {
+            if (to === -1) {
+                router.back();
+            }
+        }
+        else {
+            const href = (to === 'string'
+                ? to
+                : to.toString());
+            const nextOptions = {
+                scroll: !options.preventScrollReset
+            };
+            if (options.replace) {
+                router.replace(href, nextOptions);
+            }
+            else {
+                router.push(href, nextOptions);
+            }
+        }
+    };
+    return navigate;
+};
+exports.useNavigate = useNavigate;
+const prefetchMap = new Map([
+    [undefined, null],
+    ['none', false],
+    ['intent', true],
+    ['render', true],
+    ['viewport', true]
+]);
+const Link = ({ to, prefetch: _prefetch, preventScrollReset, replace, ...attrs }) => {
+    const href = (typeof to === 'string'
+        ? to
+        : {
+            ...to,
+            hash: (to.hash !== '#'
+                ? to.hash
+                : undefined)
+        });
+    const prefetch = prefetchMap.get(_prefetch);
+    return (0, react_1.createElement)(link_1.default, {
+        ...attrs,
+        href,
+        prefetch,
+        replace,
+        scroll: !preventScrollReset
+    });
+};
+exports.Link = Link;
+var navigation_2 = require("next/navigation");
+Object.defineProperty(exports, "useParams", { enumerable: true, get: function () { return navigation_2.useParams; } });

package/dist/next.mjs

@@ -0,0 +1,74 @@
+import { createElement as h } from 'react';
+import { usePathname, useRouter, useSearchParams } from 'next/navigation';
+import _Link from 'next/link';
+import { makeUseIsActive } from './is-active';
+import { makeUseLocation } from './location';
+export const needSuspense = true;
+const _useLocation = () => {
+    const pathname = usePathname();
+    const searchParams = useSearchParams();
+    const search = (searchParams.size
+        ? '?' + searchParams.toString()
+        : '');
+    const location = {
+        state: undefined,
+        key: '',
+        pathname,
+        search,
+        hash: ''
+    };
+    return location;
+};
+export const useLocation = makeUseLocation(_useLocation);
+export const useIsActive = makeUseIsActive(useLocation);
+export const useNavigate = () => {
+    const router = useRouter();
+    const navigate = (to, options = {}) => {
+        if (typeof to === 'number') {
+            if (to === -1) {
+                router.back();
+            }
+        }
+        else {
+            const href = (to === 'string'
+                ? to
+                : to.toString());
+            const nextOptions = {
+                scroll: !options.preventScrollReset
+            };
+            if (options.replace) {
+                router.replace(href, nextOptions);
+            }
+            else {
+                router.push(href, nextOptions);
+            }
+        }
+    };
+    return navigate;
+};
+const prefetchMap = new Map([
+    [undefined, null],
+    ['none', false],
+    ['intent', true],
+    ['render', true],
+    ['viewport', true]
+]);
+export const Link = ({ to, prefetch: _prefetch, preventScrollReset, replace, ...attrs }) => {
+    const href = (typeof to === 'string'
+        ? to
+        : {
+            ...to,
+            hash: (to.hash !== '#'
+                ? to.hash
+                : undefined)
+        });
+    const prefetch = prefetchMap.get(_prefetch);
+    return h(_Link, {
+        ...attrs,
+        href,
+        prefetch,
+        replace,
+        scroll: !preventScrollReset
+    });
+};
+export { useParams } from 'next/navigation';

package/dist/remix.d.ts

@@ -0,0 +1,7 @@
+import type { UseIsActive } from './is-active';
+import type { UseLocation } from './location';
+export declare const needSuspense = false;
+export declare const useLocation: UseLocation;
+export declare const useIsActive: UseIsActive;
+export { Link, useNavigate, useParams } from '@remix-run/react';
+export type { LinkProps } from './dummy';

package/dist/remix.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useParams = exports.useNavigate = exports.Link = exports.useIsActive = exports.useLocation = exports.needSuspense = void 0;
+const react_1 = require("@remix-run/react");
+const is_active_1 = require("./is-active");
+const location_1 = require("./location");
+exports.needSuspense = false;
+exports.useLocation = (0, location_1.makeUseLocation)(react_1.useLocation);
+exports.useIsActive = (0, is_active_1.makeUseIsActive)(exports.useLocation);
+var react_2 = require("@remix-run/react");
+Object.defineProperty(exports, "Link", { enumerable: true, get: function () { return react_2.Link; } });
+Object.defineProperty(exports, "useNavigate", { enumerable: true, get: function () { return react_2.useNavigate; } });
+Object.defineProperty(exports, "useParams", { enumerable: true, get: function () { return react_2.useParams; } });

package/dist/remix.mjs

@@ -0,0 +1,7 @@
+import { useLocation as _useLocation } from '@remix-run/react';
+import { makeUseIsActive } from './is-active';
+import { makeUseLocation } from './location';
+export const needSuspense = false;
+export const useLocation = makeUseLocation(_useLocation);
+export const useIsActive = makeUseIsActive(useLocation);
+export { Link, useNavigate, useParams } from '@remix-run/react';

package/package.json

@@ -0,0 +1,77 @@
+{
+  "name": "@react-foundry/router",
+  "version": "0.1.0",
+  "description": "An abstraction layer over the routers from react-router and Next.js.",
+  "main": "dist/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "default": "./dist/index.mjs"
+    },
+    "./dummy": {
+      "types": "./dist/dummy.d.ts",
+      "import": "./dist/dummy.mjs",
+      "require": "./dist/dummy.js",
+      "default": "./dist/dummy.mjs"
+    },
+    "./next": {
+      "types": "./dist/next.d.ts",
+      "import": "./dist/next.mjs",
+      "require": "./dist/next.js",
+      "default": "./dist/next.mjs"
+    },
+    "./remix": {
+      "types": "./dist/remix.d.ts",
+      "import": "./dist/remix.mjs",
+      "require": "./dist/remix.js",
+      "default": "./dist/remix.mjs"
+    }
+  },
+  "files": [
+    "/dist"
+  ],
+  "author": "Daniel A.C. Martin <npm@daniel-martin.co.uk> (http://daniel-martin.co.uk/)",
+  "license": "MIT",
+  "engines": {
+    "node": ">=12.0.0"
+  },
+  "dependencies": {
+    "@react-foundry/uri": "^0.1.0"
+  },
+  "peerDependencies": {
+    "@remix-run/react": ">2.17",
+    "next": ">15.5",
+    "react-router": ">7.8"
+  },
+  "peerDependenciesMeta": {
+    "@remix-run/react": {
+      "optional": true
+    },
+    "next": {
+      "optional": true
+    },
+    "react-router": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@remix-run/react": "2.17.4",
+    "@types/react": "19.2.9",
+    "jest": "30.2.0",
+    "jest-environment-jsdom": "30.2.0",
+    "next": "16.1.4",
+    "ts-jest": "29.4.6",
+    "typescript": "5.9.3"
+  },
+  "scripts": {
+    "test": "NODE_OPTIONS=--experimental-vm-modules jest",
+    "build": "npm run build:esm && npm run build:cjs",
+    "build:esm": "tsc -m es2022 && find dist -name '*.js' -exec sh -c 'mv \"$0\" \"${0%.js}.mjs\"' {} \\;",
+    "build:cjs": "tsc",
+    "clean": "rm -rf dist tsconfig.tsbuildinfo"
+  },
+  "module": "dist/index.mjs",
+  "typings": "dist/index.d.ts"
+}