# @djx/router

> Simple and easy-to-use lit-element router

Latest version **0.1.0** (published 2021-11-04) · ISC license · 0 weekly downloads

## Install

```sh
npm install @djx/router
pnpm add @djx/router
yarn add @djx/router
bun add @djx/router
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2021-11-04 |
| First published | 2020-05-27 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Unpacked size | 11.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | davideperozzi, schmidtsonian, joshuakeck |
| Keywords | router, lit-element, smoovy |

## Links

- npm: https://www.npmjs.com/package/@djx/router
- Repository: git@git.dorfjungs.io:dorfjungs/djx-litbase
- npm.io page: https://npm.io/package/@djx/router

## Dependencies (5)

- [lit](https://npm.io/package/lit.md) ^2.0.2
- [tslib](https://npm.io/package/tslib.md) ^1.11.1
- [@smoovy/event](https://npm.io/package/@smoovy/event.md) ^0.2.0
- [@smoovy/utils](https://npm.io/package/@smoovy/utils.md) ^0.1.15
- [@smoovy/router](https://npm.io/package/@smoovy/router.md) ^0.1.7

## Alternatives

- [express-promise-router](https://npm.io/package/express-promise-router.md) — 736.1K weekly downloads
- [next-usequerystate](https://npm.io/package/next-usequerystate.md) — 29.8K weekly downloads
- [@bitkyc08/opencodex](https://npm.io/package/@bitkyc08/opencodex.md) — 4.6K weekly downloads
- [lynkr](https://npm.io/package/lynkr.md) — 575 weekly downloads
- [baremetal.js](https://npm.io/package/baremetal.js.md) — 42 weekly downloads

## Recent versions

- 0.1.0 (latest) — 2021-11-04
- 0.0.4 — 2021-02-10
- 0.0.3 — 2020-08-04
- 0.0.2 — 2020-06-08
- 0.0.1 — 2020-05-27

## README

# @djx/router
A router built with lit-element and [@smoovy/router](https://github.com/davideperozzi/smoovy/tree/master/packages/router)

## Installation
```sh
npm install --save @djx/router
```

## Usage
Make sure you import the component somewehere in your application first:

```js
import '@djx/router';
```

You can then use it like normal web components in your markup:
```html
<nav>
  <djx-router-link>
    <a href="/random/page">Link to random page</a>
  </djx-router-link>

  <!-- Ignores blank target -->
  <djx-router-link>
    <a href="https://tinyurl.com/2fcpre6" target="_blank">
      <span>Link to external page</span>
    </a>
  </djx-router-link>
</nav>
<main>
  <djx-router-outlet>
    <!-- Display as "block" (display: block) -->
    <djx-router-link block>
      <a href="/boring/page">Link inside outlet</a>
    </djx-router-link>
  </djx-router-outlet>
</main>
```

### Maniuplating the router directly
To access the router instance you have to go throught the outlet:
```js
const outlet = document.body.querySelector('djx-router-outlet');
const router = await outlet.router;

// Do router stuff
router.addTransition(...);
```

---
_Source: https://npm.io/package/@djx/router · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._