---
url: https://lit-ui-router.dev/api/reference/types/TypedLitStateDeclaration.md
---
[lit-ui-router](../index.md) / TypedLitStateDeclaration

# Interface: TypedLitStateDeclaration\<T>

Defined in: [packages/lit-ui-router/src/interface.ts:499](https://github.com/simshanith/lit-ui-router/blob/1cd954559604dabdcb4d0a419ac42b07b38f0fba/packages/lit-ui-router/src/interface.ts#L499)

A [LitStateDeclaration](LitStateDeclaration.md) for state tables registered with
`ui-router-registry`, whose components may call typed targets for states in
the same table.

Checking such a table against [LitStateDeclaration](LitStateDeclaration.md) infers each
component's `render()` or template body, which reads the registry, which
reads the table: TypeScript reports the table as circular (TS7022). This type
checks components by [TypedLitViewComponent](TypedLitViewComponent.md) instead. Classes clear on
every supported TypeScript; template functions clear on TypeScript 5.5 and
later, and earlier compilers still need an explicit return type on them.

Checking by public members also admits a LitElement class from a second
copy of lit, which `<ui-view>` cannot render; development builds warn.

## Example

```ts
const contactState = {
  name: 'contacts.contact',
  url: '/:contactId',
  component: ContactView,
} as const satisfies TypedLitStateDeclaration;
```

## Extends

* [`StateDeclaration`](https://ui-router.github.io/core/docs/latest/interfaces/_state_interface_.statedeclaration.html)

## Type Parameters

| Type Parameter | Default type |
| ------ | ------ |
|  `T` *extends* [`DefaultResolvesType`](DefaultResolvesType.md) | [`DefaultResolvesType`](DefaultResolvesType.md) |

## Properties

| Property | Type | Description | Overrides | Defined in |
| ------ | ------ | ------ | ------ | ------ |
|  `component?` | [`TypedLitViewDeclaration`](TypedLitViewDeclaration.md)<`T`> | The Lit component to render for this state. | - | [packages/lit-ui-router/src/interface.ts:503](https://github.com/simshanith/lit-ui-router/blob/1cd954559604dabdcb4d0a419ac42b07b38f0fba/packages/lit-ui-router/src/interface.ts#L503) |
|  `views?` | { \[`key`: `string`]: [`TypedLitViewDeclaration`](TypedLitViewDeclaration.md)<`T`>; } | An optional object used to define multiple named views. | `StateDeclaration.views` | [packages/lit-ui-router/src/interface.ts:506](https://github.com/simshanith/lit-ui-router/blob/1cd954559604dabdcb4d0a419ac42b07b38f0fba/packages/lit-ui-router/src/interface.ts#L506) |