https://github.com/renddslow/static-navigator
https://github.com/renddslow/static-navigator
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/renddslow/static-navigator
- Owner: Renddslow
- Created: 2019-11-23T22:04:26.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2021-08-11T17:40:25.000Z (almost 4 years ago)
- Last Synced: 2024-04-23T05:12:13.041Z (about 1 year ago)
- Language: JavaScript
- Size: 722 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Static Navigator
[](https://packagephobia.now.sh/result?p=static-navigator) 
> Framework-free SPA-style page loading for statically generated sites.
## Installation
```
$ yarn add static-navigator
```## Usage
```html
...
...
staticNavigator();
```
## API
### staticNavigator(opts?)
Call this function in every file that needs the navigator functionality. Each link on the page will be intercepted if it's an internal link.
staticNavigator expects a DOM Node with an id of `slot` both on the current document and in the next document. This allows a fragment to be extracted and mounted in place so things like navigation bars or footers can remain in place. This also prevents a need for a separate document with just the fragment.
Returns an object with `on`, `has`, and `keys` methods.
### staticNavigator.on(event, callback)
Attach a callback to navigator events to handle errors and present loading states.
| Name | Arguments | Description |
| --- | --- | --- |
| `routeChangeStart` | nextHref | Called just before the url is pushed to the history stack |
| `routeChangeEnd` | - | Called after the HTML has been attached to the `slot` and all links have interceptors attached |
| `routeMountError` | Error | Called when there is trouble mounting the new document to the `slot` |
| `routeChangeError` | Error | Called when there is trouble fetching the new document |### staticNavigator.has(event)
A convenience method that will let you know if you're currently subscribed to an event.
### staticNavigator.keys()
A convenience method that will give you all the events that you're currently subscribed to.