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

# Interface: UIViewInjectedProps\<T>

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

Props injected into routed components by the `<ui-view>` element.

These props provide access to the current transition, resolved data,
and the router instance. Components can use these to access routing
state and navigate programmatically.

## Examples

**Using in a template function**

```ts
import { html } from 'lit';
import type { RoutedLitTemplate } from 'lit-ui-router';

const UserDetail: RoutedLitTemplate = (props) => {
  const { resolves, router } = props!;
  return html`
    <h1>User: ${resolves?.user?.name}</h1>
    <button @click=${() => router.stateService.go('users')}>
      Back to Users
    </button>
  `;
};
```

**Using in a LitElement class**

```ts
import { html, LitElement } from 'lit';
import type { UIViewInjectedProps } from 'lit-ui-router';

interface User {
  name: string;
}

class UserDetail extends LitElement {
  _uiViewProps?: UIViewInjectedProps<{ user: User }>;

  render() {
    const user = this._uiViewProps?.resolves?.user;
    return html`<h1>${user?.name}</h1>`;
  }
}
```

## See

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

## Type Parameters

| Type Parameter | Default type | Description |
| ------ | ------ | ------ |
|  `T` *extends* [`DefaultResolvesType`](DefaultResolvesType.md) | [`DefaultResolvesType`](DefaultResolvesType.md) | The shape of the resolved values object |

## Properties

| Property | Type | Description | Defined in |
| ------ | ------ | ------ | ------ |
|  `resolves` | `T` | Resolved data from state declarations; a `NOWAIT` resolve arrives as its promise | [packages/lit-ui-router/src/interface.ts:202](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router/src/interface.ts#L202) |
|  `router` | [`UIRouter`](https://ui-router.github.io/core/docs/latest/classes/_router_.uirouter.html) | The UIRouter instance for programmatic navigation | [packages/lit-ui-router/src/interface.ts:204](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router/src/interface.ts#L204) |
|  `transition?` | [`Transition`](https://ui-router.github.io/core/docs/latest/classes/_transition_transition_.transition.html) | The current transition (if one is in progress) | [packages/lit-ui-router/src/interface.ts:200](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/lit-ui-router/src/interface.ts#L200) |