chore: rename to ReactRouter6 adapter

Author: pbeshai

examples/react-router-6/src/index.css

@@ -19,21 +19,22 @@ nav {
   flex-wrap: wrap;
   gap: 12px;
   background: #eee;
-  padding: 16px;
+  padding: 0 16px;
   border-bottom: 1px solid #ddd;
   margin: -24px -24px 0;
 }
 
 nav a {
-  color: blue;
+  color: black;
+  font-weight: 600;
   text-decoration: none;
-  padding: 2px 4px;
+  padding: 12px 12px;
   display: inline-block;
 }
 
 a.active {
   color: rgb(179, 32, 93);
-  background-color: rgb(242, 228, 234);
+  background-color: white;
 }
 
 nav a:hover {

examples/react-router-6/src/index.tsx

@@ -3,8 +3,8 @@ import ReactDOM from 'react-dom/client';
 import './index.css';
 import App from './App';
 import { QueryParamProvider } from 'use-query-params';
-import { ReactRouterAdapter } from 'use-query-params/adapters/react-router';
-import { BrowserRouter, Route, Routes } from 'react-router-dom';
+import { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';
+import { BrowserRouter, Route, Routes, Navigate } from 'react-router-dom';
 import UseQueryParamExample from './UseQueryParamExample';
 import UseQueryParamsExample from './UseQueryParamsExample';
 // optionally use the query-string parse / stringify functions to
@@ -18,14 +18,15 @@ root.render(
   <React.StrictMode>
     <BrowserRouter>
       <QueryParamProvider
-        adapter={ReactRouterAdapter}
+        adapter={ReactRouter6Adapter}
         options={{
           searchStringToObject: parse,
           objectToSearchString: stringify,
         }}
       >
         <Routes>
           <Route path="/" element={<App />}>
+            <Route index element={<Navigate to="/useQueryParams" replace />} />
             <Route path="useQueryParam" element={<UseQueryParamExample />} />
             <Route path="useQueryParams" element={<UseQueryParamsExample />} />
           </Route>

examples/website-example/src/index.tsx

@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom/client';
 import './index.css';
 import App from './App';
 import { QueryParamProvider } from 'use-query-params';
-import { ReactRouterAdapter } from 'use-query-params/adapters/react-router';
+import { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';
 import { BrowserRouter, Route, Routes } from 'react-router-dom';
 // optionally use the query-string parse / stringify functions to
 // handle more advanced cases than URLSearchParams supports.
@@ -16,7 +16,7 @@ root.render(
   <React.StrictMode>
     <BrowserRouter>
       <QueryParamProvider
-        adapter={ReactRouterAdapter}
+        adapter={ReactRouter6Adapter}
         options={{
           searchStringToObject: parse,
           objectToSearchString: stringify,

package.json

@@ -48,9 +48,10 @@
   },
   "scripts": {
     "audit": "lerna-audit",
+    "clean": "lerna run clean",
     "build": "lerna run build --scope \"*-query-params\"",
     "build:uqp": "lerna run build --scope \"use-query-params\"",
-    "build:adapter": "lerna run build --scope \"use-query-params-adapter-react-router\"",
+    "build:adapter": "lerna run build --scope \"use-query-params-adapter-react-router-6\"",
     "build:sqp": "lerna run build --scope \"serialize-query-params\"",
     "clean:uqp": "lerna run clean --scope \"use-query-params\"",
     "test": "vitest",

packages/use-query-params-adapter-react-router/LICENSE packages/use-query-params-adapter-react-router-6/LICENSE

@@ -1,5 +1,5 @@
 {
-  "name": "use-query-params-adapter-react-router",
+  "name": "use-query-params-adapter-react-router-6",
   "private": true,
   "version": "0.0.1",
   "description": "React-router 6 adapter for use-query-params.",

packages/use-query-params-adapter-react-router/package.json packages/use-query-params-adapter-react-router-6/package.json

@@ -5,7 +5,7 @@ import { unstable_HistoryRouter } from 'react-router-dom';
 import { describe, afterEach } from 'vitest';
 import { QueryParamProvider, QueryParamOptions } from 'use-query-params/src';
 import { testSpec } from 'use-query-params/src/__tests__/routers/shared';
-import { ReactRouterAdapter } from '..';
+import { ReactRouter6Adapter } from '..';
 
 // use this router so we can pass our own history to inspect
 const HistoryRouter = unstable_HistoryRouter;
@@ -18,15 +18,15 @@ function renderWithRouter(
   const history = createMemoryHistory({ initialEntries: [initialRoute] });
   const results = render(
     <HistoryRouter history={history}>
-      <QueryParamProvider adapter={ReactRouterAdapter} options={options}>
+      <QueryParamProvider adapter={ReactRouter6Adapter} options={options}>
         {ui}
       </QueryParamProvider>
     </HistoryRouter>
   );
   const rerender = (ui: React.ReactNode, newOptions = options) =>
     results.rerender(
       <HistoryRouter history={history}>
-        <QueryParamProvider adapter={ReactRouterAdapter} options={newOptions}>
+        <QueryParamProvider adapter={ReactRouter6Adapter} options={newOptions}>
           {ui}
         </QueryParamProvider>
       </HistoryRouter>

packages/use-query-params-adapter-react-router/src/__tests__/react-router-6.test.tsx packages/use-query-params-adapter-react-router-6/src/__tests__/react-router-6.test.tsx

@@ -8,7 +8,7 @@ import {
 /**
  * Query Param Adapter for react-router v6
  */
-export const ReactRouterAdapter: QueryParamAdapterComponent = ({
+export const ReactRouter6Adapter: QueryParamAdapterComponent = ({
   children,
 }) => {
   const navigate = useNavigate();

packages/use-query-params-adapter-react-router/src/__tests__/setupTests.ts packages/use-query-params-adapter-react-router-6/src/__tests__/setupTests.ts

@@ -16,7 +16,7 @@
     "build:adapters": "npx lerna run build --scope \"*-adapter-*\"",
     "copy:adapters": "scripts/copy-adapters.js",
     "build-website": "npm run test && npm run build && cd examples/website-example && npm run build && npm run copy-build",
-    "clean": "rimraf dist",
+    "clean": "rimraf dist adapters",
     "dev": "cross-env NODE_ENV=development tsc -m esNext --outDir esm -w",
     "prepublishOnly": "npm run test && npm run clean && npm run build",
     "lint": "eslint --ext js,ts,tsx src",