debut des details de la page. Vu que c'est le troisieme (euh quatrieme?) composant, c'etait un peu plus rapide, mais heureusement que claude est la pour repasser derriere mes erreurs prcq en solo je n'y arriverais pas du tout!
This commit is contained in:
+21
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) Gianluca Guarini
|
||||
|
||||
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.
|
||||
+100
@@ -0,0 +1,100 @@
|
||||
<p align="righ">
|
||||
<img src="https://raw.githubusercontent.com/GianlucaGuarini/rawth/master/rawth-logo.png" alt="rawth"/>
|
||||
</p>
|
||||
|
||||
|
||||
##### Pure functional isomorphic router based on streams. It works consistently on modern browsers and on node.
|
||||
|
||||
---
|
||||
|
||||
|
||||
[![Build Status][ci-image]][ci-url]
|
||||
|
||||
[![NPM version][npm-version-image]][npm-url]
|
||||
[![NPM downloads][npm-downloads-image]][npm-url]
|
||||
[![Code Quality][codeclimate-image]][codeclimate-url]
|
||||
[![Coverage Status][coverage-image]][coverage-url]
|
||||
![rawth size][lib-size]
|
||||
[![MIT License][license-image]][license-url]
|
||||
|
||||
## Usage
|
||||
|
||||
Any `rawth.route` function creates an [erre stream](https://github.com/GianlucaGuarini/erre) connected to the main router stream. These sub-streams will be activated only when their paths will match the current router path. For example:
|
||||
|
||||
```js
|
||||
import route, { router } from 'rawth'
|
||||
|
||||
route('/users/:user').on.value(({params}) => {
|
||||
const {user} = params
|
||||
|
||||
console.log(`Hello dear ${user}`)
|
||||
})
|
||||
|
||||
// you can dispatch router events at any time
|
||||
router.push('/users/gianluca')
|
||||
```
|
||||
|
||||
The argument passed to the subscribed functions is an [`URL`](https://developer.mozilla.org/en-US/docs/Web/API/URL) object having `params` as additional property. The `params` array will contain all the matched [route parameters](https://github.com/pillarjs/path-to-regexp#parameters)
|
||||
|
||||
```js
|
||||
import route, { router } from 'rawth'
|
||||
|
||||
route('/:group/:user').on.value(({params}) => {
|
||||
const {group, user} = params
|
||||
|
||||
console.log(`Hello dear ${user}, you are part of the ${group} group`)
|
||||
})
|
||||
|
||||
// you can dispatch router events at any time
|
||||
router.push('/friends/gianluca')
|
||||
```
|
||||
|
||||
### Unsubscribe streams
|
||||
|
||||
If you want to unsubscribe to a specific route you need just to end the stream
|
||||
|
||||
```js
|
||||
import route from 'rawth'
|
||||
|
||||
const usersRouteStream = route('/users/:user')
|
||||
|
||||
// subscribe to the stream as many times as you want
|
||||
usersRouteStream.on.value(({params}) => { /* */ })
|
||||
usersRouteStream.on.value(({params}) => { /* */ })
|
||||
usersRouteStream.on.value(({params}) => { /* */ })
|
||||
|
||||
// end the stream
|
||||
usersRouteStream.end()
|
||||
```
|
||||
|
||||
### Set the base path
|
||||
|
||||
You can set the base path and override the router default options using the `configure` method
|
||||
|
||||
```js
|
||||
import { configure } from 'rawth'
|
||||
|
||||
configure({
|
||||
base: 'https://example.com',
|
||||
strict: true
|
||||
})
|
||||
|
||||
```
|
||||
|
||||
[ci-image]:https://github.com/GianlucaGuarini/rawth/actions/workflows/test.yml/badge.svg
|
||||
[ci-url]:https://github.com/GianlucaGuarini/rawth/actions/workflows/test.yml
|
||||
|
||||
[license-image]:http://img.shields.io/badge/license-MIT-000000.svg?style=flat-square
|
||||
[license-url]:LICENSE
|
||||
|
||||
[lib-size]:https://img.badgesize.io/https://unpkg.com/rawth/rawth.min.js?compression=gzip
|
||||
|
||||
[npm-version-image]:http://img.shields.io/npm/v/rawth.svg?style=flat-square
|
||||
[npm-downloads-image]:http://img.shields.io/npm/dm/rawth.svg?style=flat-square
|
||||
[npm-url]:https://npmjs.org/package/rawth
|
||||
|
||||
[coverage-image]:https://img.shields.io/coveralls/GianlucaGuarini/rawth/main.svg?style=flat-square
|
||||
[coverage-url]:https://coveralls.io/r/GianlucaGuarini/rawth?branch=main
|
||||
|
||||
[codeclimate-image]:https://api.codeclimate.com/v1/badges/5a4b8cf4736254115cb3/maintainability
|
||||
[codeclimate-url]:https://codeclimate.com/github/GianlucaGuarini/rawth/maintainability
|
||||
+776
File diff suppressed because it is too large
Load Diff
+24
@@ -0,0 +1,24 @@
|
||||
import { ErreStream } from 'erre'
|
||||
import { TokensToRegexpOptions, ParseOptions, pathToRegexp } from 'path-to-regexp'
|
||||
|
||||
type Callback = (...args: any[]) => any
|
||||
|
||||
export type URLWithParams = URL & { params: Record<string, string> }
|
||||
export type RawthOptions = TokensToRegexpOptions & ParseOptions & {
|
||||
base: string
|
||||
silentErrors: boolean
|
||||
}
|
||||
|
||||
// internal methods that probably you will never use by yourselves
|
||||
export declare const toRegexp: typeof pathToRegexp
|
||||
export declare const toPath: (path: string, params: Record<string, string>, options: RawthOptions) => string
|
||||
export declare const toURL: (path: string, pathRegExp: RegExp, options: RawthOptions) => URLWithParams
|
||||
export declare const match: (path: string, pathRegExp: RegExp) => boolean
|
||||
export declare const createURLStreamPipe: (pathRegExp: RegExp, options: RawthOptions) => Callback[]
|
||||
|
||||
// public API
|
||||
export declare const router: ErreStream<string, string, string>
|
||||
export declare const defaults: RawthOptions
|
||||
export declare const configure: (options: Partial<RawthOptions>) => RawthOptions
|
||||
export declare function route(path: string): ErreStream<URLWithParams, URLWithParams, URLWithParams>
|
||||
export default route
|
||||
+758
File diff suppressed because it is too large
Load Diff
+164
@@ -0,0 +1,164 @@
|
||||
import {compile, pathToRegexp} from 'path-to-regexp'
|
||||
import erre from 'erre'
|
||||
|
||||
const isString = str => typeof str === 'string'
|
||||
const parseURL = (...args) => new URL(...args)
|
||||
|
||||
/**
|
||||
* Replace the base path from a path
|
||||
* @param {string} path - router path string
|
||||
* @returns {string} path cleaned up without the base
|
||||
*/
|
||||
const replaceBase = path => path.replace(defaults.base, '')
|
||||
|
||||
/**
|
||||
* Try to match the current path or skip it
|
||||
* @param {RegExp} pathRegExp - target path transformed by pathToRegexp
|
||||
* @returns {string|Symbol} if the path match we return it otherwise we cancel the stream
|
||||
*/
|
||||
const matchOrSkip = pathRegExp => path => match(path, pathRegExp) ? path : erre.cancel()
|
||||
|
||||
/**
|
||||
* Combine 2 streams connecting the events of dispatcherStream to the receiverStream
|
||||
* @param {Stream} dispatcherStream - main stream dispatching events
|
||||
* @param {Stream} receiverStream - sub stream receiving events from the dispatcher
|
||||
* @returns {Stream} receiverStream
|
||||
*/
|
||||
const joinStreams = (dispatcherStream, receiverStream) => {
|
||||
dispatcherStream.on.value(receiverStream.push)
|
||||
|
||||
receiverStream.on.end(() => {
|
||||
dispatcherStream.off.value(receiverStream.push)
|
||||
})
|
||||
|
||||
return receiverStream
|
||||
}
|
||||
|
||||
/**
|
||||
* Error handling function
|
||||
* @param {Error} error - error to catch
|
||||
* @returns {void}
|
||||
*/
|
||||
/* c8 ignore start */
|
||||
const panic = error => {
|
||||
if (defaults.silentErrors) return
|
||||
|
||||
throw new Error(error)
|
||||
}
|
||||
/* c8 ignore stop */
|
||||
|
||||
// make sure that the router will always receive strings params
|
||||
const filterStrings = str => isString(str) ? str : erre.cancel()
|
||||
|
||||
// create the streaming router
|
||||
export const router = erre(filterStrings).on.error(panic) // cast the values of this stream always to string
|
||||
|
||||
/**
|
||||
* Merge the user options with the defaults
|
||||
* @param {Object} options - custom user options
|
||||
* @returns {Object} options object merged with defaults
|
||||
*/
|
||||
const mergeOptions = options => ({...defaults, ...options})
|
||||
|
||||
/* @type {object} general configuration object */
|
||||
export const defaults = {
|
||||
base: 'https://localhost',
|
||||
silentErrors: false,
|
||||
// pathToRegexp options
|
||||
sensitive: false,
|
||||
strict: false,
|
||||
end: true,
|
||||
start: true,
|
||||
delimiter: '/#?',
|
||||
encode: undefined,
|
||||
endsWith: undefined,
|
||||
prefixes: './'
|
||||
}
|
||||
|
||||
/**
|
||||
* Configure the router options overriding the defaults
|
||||
* @param {Object} options - custom user options to override
|
||||
* @returns {Object} new defaults
|
||||
*/
|
||||
export const configure = (options) => {
|
||||
Object.entries(options).forEach(([key, value]) => {
|
||||
if (Object.hasOwn(defaults, key)) defaults[key] = value
|
||||
})
|
||||
|
||||
return defaults
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* {@link https://github.com/pillarjs/path-to-regexp#usage} */
|
||||
export const toRegexp = (path, keys, options) => pathToRegexp(path, keys, mergeOptions(options))
|
||||
|
||||
/**
|
||||
* Convert a router entry to a real path computing the url parameters
|
||||
* @param {string} path - router path string
|
||||
* @param {Object} params - named matched parameters
|
||||
* @param {Object} options - pathToRegexp options object
|
||||
* @returns {string} computed url string
|
||||
*/
|
||||
export const toPath = (path, params, options) => compile(path, mergeOptions(options))(params)
|
||||
|
||||
/**
|
||||
* Parse a string path generating an object containing
|
||||
* @param {string} path - target path
|
||||
* @param {RegExp} pathRegExp - path transformed to regexp via pathToRegexp
|
||||
* @param {Object} options - object containing the base path
|
||||
* @returns {URL} url object enhanced with the `match` attribute
|
||||
*/
|
||||
export const toURL = (path, pathRegExp, options = {}) => {
|
||||
const {base} = mergeOptions(options)
|
||||
const [, ...params] = pathRegExp.exec(path)
|
||||
const url = parseURL(path, base)
|
||||
|
||||
// extend the url object adding the matched params
|
||||
url.params = params.reduce((acc, param, index) => {
|
||||
const key = options.keys && options.keys[index]
|
||||
if (key) acc[key.name] = param ? decodeURIComponent(param) : param
|
||||
return acc
|
||||
}, {})
|
||||
|
||||
return url
|
||||
}
|
||||
|
||||
/**
|
||||
* Return true if a path will be matched
|
||||
* @param {string} path - target path
|
||||
* @param {RegExp} pathRegExp - path transformed to regexp via pathToRegexp
|
||||
* @returns {boolean} true if the path matches the regexp
|
||||
*/
|
||||
export const match = (path, pathRegExp) => pathRegExp.test(path)
|
||||
|
||||
/**
|
||||
* Factory function to create an sequence of functions to pass to erre.js
|
||||
* This function will be used in the erre stream
|
||||
* @param {RegExp} pathRegExp - path transformed to regexp via pathToRegexp
|
||||
* @param {Object} options - pathToRegexp options object
|
||||
* @returns {Array} a functions array that will be used as stream pipe for erre.js
|
||||
*/
|
||||
export const createURLStreamPipe = (pathRegExp, options) => [
|
||||
decodeURI,
|
||||
replaceBase,
|
||||
matchOrSkip(pathRegExp, options),
|
||||
path => toURL(path, pathRegExp, options)
|
||||
]
|
||||
|
||||
/**
|
||||
* Create a fork of the main router stream
|
||||
* @param {string} path - route to match
|
||||
* @param {Object} options - pathToRegexp options object
|
||||
* @returns {Stream} new route stream
|
||||
*/
|
||||
export default function createRoute(path, options) {
|
||||
const keys = []
|
||||
const pathRegExp = pathToRegexp(path, keys, options)
|
||||
const URLStream = erre(...createURLStreamPipe(pathRegExp, {
|
||||
...options,
|
||||
keys
|
||||
}))
|
||||
|
||||
return joinStreams(router, URLStream).on.error(panic)
|
||||
}
|
||||
+59
@@ -0,0 +1,59 @@
|
||||
{
|
||||
"name": "rawth",
|
||||
"version": "3.0.0",
|
||||
"description": "Pure functional isomorphic router based on streams",
|
||||
"main": "index.js",
|
||||
"types": "index.d.ts",
|
||||
"type": "module",
|
||||
"exports": {
|
||||
"types": "./index.d.ts",
|
||||
"import": "./index.js",
|
||||
"require": "./index.cjs"
|
||||
},
|
||||
"scripts": {
|
||||
"prepublishOnly": "npm run build && npm test",
|
||||
"lint": "eslint index.next.js test.js rollup.config.js",
|
||||
"build": "rollup -c",
|
||||
"cov-report": "c8 report --reporter=lcov --reporter=text",
|
||||
"test": "npm run lint && c8 mocha test.js"
|
||||
},
|
||||
"files": [
|
||||
"index.next.js",
|
||||
"index.js",
|
||||
"index.cjs",
|
||||
"index.d.ts"
|
||||
],
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/GianlucaGuarini/rawth.git"
|
||||
},
|
||||
"keywords": [
|
||||
"stream",
|
||||
"streams",
|
||||
"functional",
|
||||
"route",
|
||||
"URL",
|
||||
"router"
|
||||
],
|
||||
"author": "Gianluca Guarini <gianluca.guarini@gmail.com> (https://gianlucaguarini.com)",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/GianlucaGuarini/rawth/issues"
|
||||
},
|
||||
"homepage": "https://github.com/GianlucaGuarini/rawth#readme",
|
||||
"devDependencies": {
|
||||
"@gianlucaguarini/eslint-config": "^2.0.0",
|
||||
"@rollup/plugin-commonjs": "^25.0.4",
|
||||
"@rollup/plugin-node-resolve": "^15.2.1",
|
||||
"c8": "^8.0.1",
|
||||
"chai": "^4.3.10",
|
||||
"coveralls": "^3.1.1",
|
||||
"eslint": "^8.50.0",
|
||||
"mocha": "^10.2.0",
|
||||
"rollup": "^3.29.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"erre": "^3.0.1",
|
||||
"path-to-regexp": "^6.2.1"
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user