2.0.0 • Published 1 month ago
@swan-io/chicane v2.0.0
@swan-io/chicane
A simple and safe router for React and TypeScript.
Design principles
- Typed routes: improving the DX, and making sure all your params are here!
- Component-friendly: the router nicely fits in your React app.
- Easy-to-use: naming routes instead of moving around unsafe URLs.
- Performant: avoids any unnecessary render.
Installation
$ yarn add @swan-io/chicane
# --- or ---
$ npm install --save @swan-io/chicane
Links
Quickstart
import { createRouter } from "@swan-io/chicane";
import { match } from "ts-pattern";
const Router = createRouter({
Home: "/",
Users: "/users",
User: "/users/:userId",
});
const App = () => {
const route = Router.useRoute(["Home", "Users", "User"]);
// route object is a discriminated union
return match(route)
.with({ name: "Home" }, () => <h1>Home</h1>)
.with({ name: "Users" }, () => <h1>Users</h1>)
.with({ name: "User" }, ({ params }) => <h1>User {params.userId}</h1>) // params are strongly typed
.otherwise(() => <h1>404</h1>);
};
Run the example app
$ git clone git@github.com:swan-io/chicane.git
$ cd chicane/example
$ yarn install && yarn dev
# --- or ---
$ npm install && npm run dev
🙌 Acknowledgements
- react-router for the
history
and theLink
creation code. - reach-router for the path ranking algorithm.
2.0.0
1 month ago
2.0.0-rc.2
2 months ago
2.0.0-rc.1
2 months ago
2.0.0-rc.0
2 months ago
1.4.1
11 months ago
1.4.0
12 months ago
1.3.4
1 year ago
1.3.3
1 year ago
1.3.2
2 years ago
1.3.1
2 years ago
1.2.5
2 years ago
1.3.0
2 years ago
1.3.0-rc.0
2 years ago
1.2.4
2 years ago
1.2.3
2 years ago
1.2.2
2 years ago
1.2.1
2 years ago
1.2.0
2 years ago
1.1.0
2 years ago
1.0.2
2 years ago
1.0.1
2 years ago
1.0.4
2 years ago
1.0.3
2 years ago
1.0.0
2 years ago