# solid-route-progress

> Route progress bar for SolidJS and SolidStart: the thin loading bar along the top of the page. The loading drift is one CSS transition; about 2.4 kB, no dependencies, Tailwind v4 friendly.

Install with `npm i solid-route-progress` and import `solid-route-progress/style.css` once.
Peer dependencies: `@solidjs/router` ^0.15.0 || ^1.0.0, `solid-js` ^1.9.0 (the router one only for `solid-route-progress/router`).
Every link below is a Markdown copy of a docs page; drop the `.md` for the HTML page.

## Getting started
- [Introduction](https://solid-route-progress.vercel.app/docs.md): Entry points, what JavaScript writes to the bar, and what each entry costs.
- [Installation](https://solid-route-progress.vercel.app/docs/installation.md): Install the package, import the stylesheet, and check browser support.
- [Quick start](https://solid-route-progress.vercel.app/docs/quick-start.md): Add the bar to a @solidjs/router or SolidStart app, to a page without a router, or drive it yourself.
- [Styling](https://solid-route-progress.vercel.app/docs/styling.md): Custom properties, Tailwind utilities, state hooks, custom templates, and paste-in recipes.

## Examples
- [Examples](https://solid-route-progress.vercel.app/docs/examples.md): Live demos of track(), holds, set(), custom templates, skipped navigations, and style recipes.

## API
- [Controller](https://solid-route-progress.vercel.app/docs/controller.md): createProgress() options, start(), done(), set(), track(), the signals, and the types.
- [Components](https://solid-route-progress.vercel.app/docs/components.md): <Progress>, <ProgressProvider>, useProgress(), <Bar>, and ProgressContext.
- [Router integration](https://solid-route-progress.vercel.app/docs/router.md): <RouteProgress> for @solidjs/router: ignored links, cross-document navigations, and actions.
- [Navigation API](https://solid-route-progress.vercel.app/docs/navigation-api.md): <NavigationProgress> drives the bar from the browser Navigation API, without a router.

## Optional
- [All docs in one file](https://solid-route-progress.vercel.app/llms-full.txt): every page above, concatenated
- [Agent skill](https://github.com/kecan0406/solid-route-progress/tree/main/skills/solid-route-progress): `npx skills add kecan0406/solid-route-progress`
- [Changelog](https://github.com/kecan0406/solid-route-progress/blob/main/CHANGELOG.md): release notes
- [Source](https://github.com/kecan0406/solid-route-progress): the repository