@owlmeans/web-router-react-router 0.1.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md ADDED
@@ -0,0 +1,16 @@
1
+ <!-- owlmeans:agent-guidance:start -->
2
+ ## Agent guidance
3
+
4
+ This package ships embedded Claude Code skills and GitHub Copilot instructions under
5
+ `agent-meta/`. After installing your `@owlmeans/*` packages, run the OwlMeans
6
+ agent-skills installer to place them into your project's native locations
7
+ (`.claude/skills/` and `.github/instructions/`):
8
+
9
+ ```sh
10
+ npx @owlmeans/agent-skills
11
+ ```
12
+
13
+ The embedded files are version-matched to this package release. Do not edit them
14
+ directly — they are regenerated on each publish. To contribute guidance edits,
15
+ open a PR against the source monorepo.
16
+ <!-- owlmeans:agent-guidance:end -->
@@ -0,0 +1,34 @@
1
+ ---
2
+ description: "How to use @owlmeans/web-router-react-router — the opt-in React Router v7 routing plugin for OwlMeans. Use when an app should route with react-router instead of the default OwlMeans browser router."
3
+ applyTo: "**/*.ts, **/*.tsx"
4
+ ---
5
+ <!-- AUTO-GENERATED — do not edit. Regenerate via sync-agent-meta. -->
6
+
7
+ # @owlmeans/web-router-react-router
8
+
9
+ **Layer:** Web (React), L2
10
+ **Install:** `"@owlmeans/web-router-react-router": "^0.1.14"` in `dependencies`
11
+
12
+ React Router v7 as an OwlMeans routing plugin, extracted from the former `web-router` so react-router
13
+ is opt-in. OwlMeans in-browser routing is the default.
14
+
15
+ ## Key Exports
16
+
17
+ | Export | Description |
18
+ |--------|-------------|
19
+ | `appendReactRouter(ctx)` | Register the react-router plugin (priority 100 → wins the cascade). |
20
+ | `makeReactRouterPlugin()` | The `RouterPlugin` (alias `react-router`); `compile` = `createBrowserRouter`. |
21
+ | `REACT_ROUTER`, `REACT_ROUTER_PRIORITY` | Constants. |
22
+
23
+ ## Usage
24
+
25
+ ```typescript
26
+ import { appendReactRouter } from '@owlmeans/web-router-react-router'
27
+ export const makeContext = (cfg) => { const c = makeBaseContext(cfg); appendReactRouter(c); return c }
28
+ ```
29
+
30
+ Route/entrypoint declarations don't change — path descriptions are identical.
31
+
32
+ ## Depends On
33
+
34
+ - `@owlmeans/router`, `@owlmeans/context`; peer `react`, `react-router@^7.9.6`
@@ -0,0 +1,23 @@
1
+ {
2
+ "schemaVersion": 1,
3
+ "package": "@owlmeans/web-router-react-router",
4
+ "version": "0.1.14",
5
+ "generatedAt": "2026-08-05T16:56:53.379Z",
6
+ "canonicalRepo": "https://github.com/owlmeans/common",
7
+ "entries": [
8
+ {
9
+ "kind": "skill",
10
+ "name": "web-router-react-router",
11
+ "category": "package-specific",
12
+ "file": "skills/web-router-react-router/SKILL.md",
13
+ "canonicalPath": ".claude/skills/web-router-react-router/SKILL.md"
14
+ },
15
+ {
16
+ "kind": "instruction",
17
+ "name": "web-router-react-router",
18
+ "category": "package-specific",
19
+ "file": "instructions/web-router-react-router.instructions.md",
20
+ "canonicalPath": ".github/instructions/web-router-react-router.instructions.md"
21
+ }
22
+ ]
23
+ }
@@ -0,0 +1,49 @@
1
+ ---
2
+ name: web-router-react-router
3
+ description: How to use @owlmeans/web-router-react-router — the opt-in React Router v7 routing plugin for OwlMeans (register with appendReactRouter to override the default OwlMeans browser router). Auto-invoked when using react-router with OwlMeans.
4
+ user-invocable: false
5
+ ---
6
+ <!-- AUTO-GENERATED — do not edit. Regenerate via sync-agent-meta. -->
7
+
8
+ # @owlmeans/web-router-react-router
9
+
10
+ **Layer:** Web (React), build level L2
11
+ **Install:** `"@owlmeans/web-router-react-router": "^0.1.14"` in `dependencies`
12
+
13
+ The React Router v7 mechanic as an OwlMeans routing plugin. Extracted from the former `web-router`
14
+ so react-router is **opt-in**: OwlMeans in-browser routing is the default, and you add this plugin
15
+ only when you specifically want react-router.
16
+
17
+ ## Key Exports
18
+
19
+ | Export | Description |
20
+ |--------|-------------|
21
+ | `appendReactRouter(ctx)` | Register the react-router plugin on the router host (priority 100 → wins the cascade over the default). |
22
+ | `makeReactRouterPlugin()` | The `RouterPlugin` (alias `react-router`). `compile` = `createBrowserRouter`; provider/outlet/hooks from react-router. |
23
+ | Constants | `REACT_ROUTER`, `REACT_ROUTER_PRIORITY`. |
24
+
25
+ ## Usage
26
+
27
+ ```typescript
28
+ import { appendReactRouter } from '@owlmeans/web-router-react-router'
29
+
30
+ export const makeContext = (cfg) => {
31
+ const context = makeBaseContext(cfg) // registers the default OwlMeans browser plugin
32
+ appendReactRouter(context) // react-router now handles routing instead
33
+ return context
34
+ }
35
+ ```
36
+
37
+ Because it registers at priority 100 (above the default 0), calling `appendReactRouter` after the
38
+ default `appendWebRouter` makes react-router the active plugin via the cascade — no other changes
39
+ needed. Route descriptions are identical (same path placeholders), so route/entrypoint declarations
40
+ don't change.
41
+
42
+ ## Depends On
43
+
44
+ - `@owlmeans/router` (host), `@owlmeans/context`
45
+ - peer `react`, `react-router@^7.9.6`
46
+
47
+ ## Related
48
+
49
+ - [[router]] (host) · [[web-router]] (default OwlMeans plugin) · [[router-plugins]] (the plugin model)
@@ -0,0 +1,4 @@
1
+ export declare const REACT_ROUTER = "react-router";
2
+ /** Registered above the default OwlMeans plugin so it wins the cascade when added. */
3
+ export declare const REACT_ROUTER_PRIORITY = 100;
4
+ //# sourceMappingURL=consts.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../src/consts.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,YAAY,iBAAiB,CAAA;AAE1C,sFAAsF;AACtF,eAAO,MAAM,qBAAqB,MAAM,CAAA"}
@@ -0,0 +1,4 @@
1
+ export const REACT_ROUTER = 'react-router';
2
+ /** Registered above the default OwlMeans plugin so it wins the cascade when added. */
3
+ export const REACT_ROUTER_PRIORITY = 100;
4
+ //# sourceMappingURL=consts.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"consts.js","sourceRoot":"","sources":["../src/consts.ts"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,YAAY,GAAG,cAAc,CAAA;AAE1C,sFAAsF;AACtF,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAA"}
@@ -0,0 +1,4 @@
1
+ export * from './consts.js';
2
+ export * from './plugin.js';
3
+ export * from './service.js';
4
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA"}
package/build/index.js ADDED
@@ -0,0 +1,4 @@
1
+ export * from './consts.js';
2
+ export * from './plugin.js';
3
+ export * from './service.js';
4
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,aAAa,CAAA;AAC3B,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA"}
@@ -0,0 +1,8 @@
1
+ import type { RouterPlugin } from '@owlmeans/router';
2
+ /**
3
+ * React Router v7 as an OwlMeans routing plugin. Extracted from the former
4
+ * `web-router` so react-router is opt-in: register it with `appendReactRouter`
5
+ * (or a `clientPlugin` preference) and its higher priority wins the cascade.
6
+ */
7
+ export declare const makeReactRouterPlugin: () => RouterPlugin;
8
+ //# sourceMappingURL=plugin.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../src/plugin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAA8B,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAShF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,QAAO,YAYvC,CAAA"}
@@ -0,0 +1,21 @@
1
+ import { Outlet, RouterProvider, createBrowserRouter, useLocation as rrUseLocation, useNavigate as rrUseNavigate, useParams as rrUseParams, useSearchParams as rrUseSearchParams } from 'react-router';
2
+ import { REACT_ROUTER, REACT_ROUTER_PRIORITY } from './consts.js';
3
+ /**
4
+ * React Router v7 as an OwlMeans routing plugin. Extracted from the former
5
+ * `web-router` so react-router is opt-in: register it with `appendReactRouter`
6
+ * (or a `clientPlugin` preference) and its higher priority wins the cascade.
7
+ */
8
+ export const makeReactRouterPlugin = () => ({
9
+ alias: REACT_ROUTER,
10
+ priority: REACT_ROUTER_PRIORITY,
11
+ mode: 'browser',
12
+ match: () => true,
13
+ compile: routes => createBrowserRouter(routes),
14
+ provider: () => RouterProvider,
15
+ outlet: () => Outlet,
16
+ useParams: () => rrUseParams(),
17
+ useLocation: () => rrUseLocation(),
18
+ useNavigate: () => rrUseNavigate(),
19
+ useSearchParams: init => rrUseSearchParams(init)
20
+ });
21
+ //# sourceMappingURL=plugin.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"plugin.js","sourceRoot":"","sources":["../src/plugin.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,MAAM,EAAE,cAAc,EAAE,mBAAmB,EAC3C,WAAW,IAAI,aAAa,EAAE,WAAW,IAAI,aAAa,EAC1D,SAAS,IAAI,WAAW,EAAE,eAAe,IAAI,iBAAiB,EAC/D,MAAM,cAAc,CAAA;AACrB,OAAO,EAAE,YAAY,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAA;AAEjE;;;;GAIG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAiB,EAAE,CAAC,CAAC;IACxD,KAAK,EAAE,YAAY;IACnB,QAAQ,EAAE,qBAAqB;IAC/B,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,GAAG,EAAE,CAAC,IAAI;IACjB,OAAO,EAAE,MAAM,CAAC,EAAE,CAAC,mBAAmB,CAAC,MAA4B,CAA6B;IAChG,QAAQ,EAAE,GAAG,EAAE,CAAC,cAAc;IAC9B,MAAM,EAAE,GAAG,EAAE,CAAC,MAAM;IACpB,SAAS,EAAE,GAAwC,EAAE,CAAC,WAAW,EAAO;IACxE,WAAW,EAAE,GAAG,EAAE,CAAC,aAAa,EAAE;IAClC,WAAW,EAAE,GAAG,EAAE,CAAC,aAAa,EAAE;IAClC,eAAe,EAAE,IAAI,CAAC,EAAE,CAAC,iBAAiB,CAAC,IAAW,CAAQ;CAC/D,CAAC,CAAA"}
@@ -0,0 +1,8 @@
1
+ import type { BasicConfig, BasicContext } from '@owlmeans/context';
2
+ /**
3
+ * Register the react-router plugin on a context. It registers at a higher
4
+ * priority than the default OwlMeans browser plugin, so calling this from an
5
+ * app's `makeContext` switches routing to react-router.
6
+ */
7
+ export declare const appendReactRouter: <C extends BasicConfig, T extends BasicContext<C>>(ctx: T) => T;
8
+ //# sourceMappingURL=service.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"service.d.ts","sourceRoot":"","sources":["../src/service.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAIlE;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,GAAI,CAAC,SAAS,WAAW,EAAE,CAAC,SAAS,YAAY,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,KAAG,CAI5F,CAAA"}
@@ -0,0 +1,13 @@
1
+ import { ensureRouterService } from '@owlmeans/router';
2
+ import { makeReactRouterPlugin } from './plugin.js';
3
+ /**
4
+ * Register the react-router plugin on a context. It registers at a higher
5
+ * priority than the default OwlMeans browser plugin, so calling this from an
6
+ * app's `makeContext` switches routing to react-router.
7
+ */
8
+ export const appendReactRouter = (ctx) => {
9
+ const service = ensureRouterService(ctx);
10
+ service.registerPlugin(makeReactRouterPlugin());
11
+ return ctx;
12
+ };
13
+ //# sourceMappingURL=service.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"service.js","sourceRoot":"","sources":["../src/service.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAA;AAEnD;;;;GAIG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAmD,GAAM,EAAK,EAAE;IAC/F,MAAM,OAAO,GAAG,mBAAmB,CAAC,GAAG,CAAC,CAAA;IACxC,OAAO,CAAC,cAAc,CAAC,qBAAqB,EAAE,CAAC,CAAA;IAC/C,OAAO,GAAG,CAAA;AACZ,CAAC,CAAA"}
package/package.json ADDED
@@ -0,0 +1,42 @@
1
+ {
2
+ "name": "@owlmeans/web-router-react-router",
3
+ "version": "0.1.14",
4
+ "license": "MIT",
5
+ "type": "module",
6
+ "scripts": {
7
+ "build": "tsc -b",
8
+ "dev": "sleep 63 && nodemon -e ts,tsx,json --watch src --exec \"tsc -p ./tsconfig.json\"",
9
+ "watch": "tsc -b -w --preserveWatchOutput --pretty"
10
+ },
11
+ "main": "build/index.js",
12
+ "module": "build/index.js",
13
+ "types": "build/index.d.ts",
14
+ "exports": {
15
+ ".": {
16
+ "import": "./build/index.js",
17
+ "require": "./build/index.js",
18
+ "default": "./build/index.js",
19
+ "module": "./build/index.js",
20
+ "types": "./build/index.d.ts"
21
+ }
22
+ },
23
+ "peerDependencies": {
24
+ "react": "*",
25
+ "react-router": "^7.9.6"
26
+ },
27
+ "devDependencies": {
28
+ "@owlmeans/dep-config": "workspace:*",
29
+ "@types/node": "^26.1.0",
30
+ "@types/react": "^19.2.17",
31
+ "nodemon": "^3.1.14",
32
+ "react-router": "^7.9.6",
33
+ "typescript": "^6.0.3"
34
+ },
35
+ "dependencies": {
36
+ "@owlmeans/context": "^0.1.14",
37
+ "@owlmeans/router": "^0.1.14"
38
+ },
39
+ "publishConfig": {
40
+ "access": "public"
41
+ }
42
+ }
package/src/consts.ts ADDED
@@ -0,0 +1,5 @@
1
+
2
+ export const REACT_ROUTER = 'react-router'
3
+
4
+ /** Registered above the default OwlMeans plugin so it wins the cascade when added. */
5
+ export const REACT_ROUTER_PRIORITY = 100
package/src/index.ts ADDED
@@ -0,0 +1,4 @@
1
+
2
+ export * from './consts.js'
3
+ export * from './plugin.js'
4
+ export * from './service.js'
package/src/plugin.ts ADDED
@@ -0,0 +1,27 @@
1
+ import type { LibraryRouter, RouteParams, RouterPlugin } from '@owlmeans/router'
2
+ import type { RouteObject as ReactRouteObject } from 'react-router'
3
+ import {
4
+ Outlet, RouterProvider, createBrowserRouter,
5
+ useLocation as rrUseLocation, useNavigate as rrUseNavigate,
6
+ useParams as rrUseParams, useSearchParams as rrUseSearchParams
7
+ } from 'react-router'
8
+ import { REACT_ROUTER, REACT_ROUTER_PRIORITY } from './consts.js'
9
+
10
+ /**
11
+ * React Router v7 as an OwlMeans routing plugin. Extracted from the former
12
+ * `web-router` so react-router is opt-in: register it with `appendReactRouter`
13
+ * (or a `clientPlugin` preference) and its higher priority wins the cascade.
14
+ */
15
+ export const makeReactRouterPlugin = (): RouterPlugin => ({
16
+ alias: REACT_ROUTER,
17
+ priority: REACT_ROUTER_PRIORITY,
18
+ mode: 'browser',
19
+ match: () => true,
20
+ compile: routes => createBrowserRouter(routes as ReactRouteObject[]) as unknown as LibraryRouter,
21
+ provider: () => RouterProvider,
22
+ outlet: () => Outlet,
23
+ useParams: <T extends RouteParams = RouteParams>() => rrUseParams() as T,
24
+ useLocation: () => rrUseLocation(),
25
+ useNavigate: () => rrUseNavigate(),
26
+ useSearchParams: init => rrUseSearchParams(init as any) as any
27
+ })
package/src/service.ts ADDED
@@ -0,0 +1,14 @@
1
+ import type { BasicConfig, BasicContext } from '@owlmeans/context'
2
+ import { ensureRouterService } from '@owlmeans/router'
3
+ import { makeReactRouterPlugin } from './plugin.js'
4
+
5
+ /**
6
+ * Register the react-router plugin on a context. It registers at a higher
7
+ * priority than the default OwlMeans browser plugin, so calling this from an
8
+ * app's `makeContext` switches routing to react-router.
9
+ */
10
+ export const appendReactRouter = <C extends BasicConfig, T extends BasicContext<C>>(ctx: T): T => {
11
+ const service = ensureRouterService(ctx)
12
+ service.registerPlugin(makeReactRouterPlugin())
13
+ return ctx
14
+ }
package/tsconfig.json ADDED
@@ -0,0 +1,11 @@
1
+ {
2
+ "extends": [
3
+ "@owlmeans/dep-config/tsconfig.base.json",
4
+ "@owlmeans/dep-config/tsconfig.react.json"
5
+ ],
6
+ "compilerOptions": {
7
+ "rootDir": "./src/",
8
+ "outDir": "./build/"
9
+ },
10
+ "exclude": ["./dist/**/*", "./build/**/*", "./*.ts"]
11
+ }