---
url: https://lit-ui-router.dev/reference/lit-ui-router/core/UIRouterLit.md
---
[lit-ui-router](../index.md) / UIRouterLit

# Class: UIRouterLit

Defined in: [packages/lit-ui-router/src/core.ts:122](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router/src/core.ts#L122)

The main router class for Lit applications.

UIRouterLit extends the core [UIRouter](https://ui-router.github.io/core/docs/latest/classes/_router_.uirouter.html)
class from @uirouter/core, adding Lit-specific view handling and component integration.

## Examples

**Basic usage**

```ts
import { UIRouterLit, type LitStateDeclaration } from 'lit-ui-router';
import { hashLocationPlugin } from '@uirouter/core';
import { LitElement } from 'lit';

class HomeComponent extends LitElement {}

// Create router instance
const router = new UIRouterLit();

// Add a location plugin (hash-based or push state)
router.plugin(hashLocationPlugin);

// Register states
const states: LitStateDeclaration[] = [
  { name: 'home', url: '/home', component: HomeComponent },
];
states.forEach((state) => router.stateRegistry.register(state));

// Start the router
router.start();
```

**With push state and base URL**

```ts
import { UIRouterLit } from 'lit-ui-router';
import { pushStateLocationPlugin } from '@uirouter/core';

const router = new UIRouterLit();
// Reads the base URL from the document's <base href="/app/"> tag
router.plugin(pushStateLocationPlugin);

router.start();
```

## See

* [UI-Router Core Documentation](https://ui-router.github.io/core/docs/latest/)
* [UIRouter API Reference](https://ui-router.github.io/core/docs/latest/classes/_router_.uirouter.html)

## Extends

* [`UIRouter`](https://ui-router.github.io/core/docs/latest/classes/_router_.uirouter.html)

## Constructors

### Constructor

```ts
new UIRouterLit(): UIRouterLit;
```

Defined in: [packages/lit-ui-router/src/core.ts:131](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router/src/core.ts#L131)

Create a new UIRouterLit instance.

The constructor automatically:

* Applies the services plugin for browser integration
* Registers the Lit view config factory
* Decorates the state registry with Lit-specific view building

#### Returns

`UIRouterLit`

#### Overrides

`UIRouter.constructor`

## Methods

### start()

```ts
start(): void;
```

Defined in: [packages/lit-ui-router/src/core.ts:161](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router/src/core.ts#L161)

Start the router and begin listening for URL changes.

This method initializes URL synchronization and begins processing
state transitions based on the current URL.

#### Returns

`void`

#### Throws

If `start()` has already been called on this router instance

#### Example

```ts
import { hashLocationPlugin } from '@uirouter/core';
import { UIRouterLit } from 'lit-ui-router';

const router = new UIRouterLit();
router.plugin(hashLocationPlugin);
// Register states...
router.start(); // Begin routing
```