---
url: https://lit-ui-router.dev/api/lit-ui-router-effect/classes/RefController.md
---
[lit-ui-router-effect](../index.md) / RefController

# Class: RefController\<Refs, T>

Defined in: [lit-ui-router-effect/src/ref-controller.ts:114](https://github.com/simshanith/lit-ui-router/blob/92660184d9980e90964f7e785d5efeb5cae43b42/packages/lit-ui-router-effect/src/ref-controller.ts#L114)

A ReactiveController that composes Effect's `SubscriptionRef` with the Lit
lifecycle: it selects over one or more refs and calls
`host.requestUpdate()` when the selected value changes.

The subscription is a single fiber — `Stream.runForEach` over the refs'
`changes` — forked in `hostConnected` and interrupted in
`hostDisconnected`, so it lives exactly as long as the host is in the
document. The interrupt goes to the fiber directly, so it does not depend
on the runtime still being alive. `changes` replays the current value, and
the controller also seeds `.value` synchronously on connect, so a
reconnected host (a sticky routed component) renders current state, never
stale state.

Refs given directly are read once more at construction, so `.value` is
live before the host ever connects — a host rendered on the server sees
the same value a browser would. Refs resolved on connect carry
`options.initialValue` until then.

The selected value is exposed as `.value` for use in `render()`.

## Extended by

* [`RouterRefController`](RouterRefController.md)

## Type Parameters

| Type Parameter |
| ------ |
|  `Refs` *extends* [`SubscriptionRefs`](../type-aliases/SubscriptionRefs.md) |
|  `T` |

## Implements

* [`ReactiveController`](https://lit.dev/docs/api/controllers/#ReactiveController)

## Constructors

### Constructor

```ts
new RefController<Refs, T>(
   host, 
   refs, 
   selector, 
   options?
): RefController<Refs, T>;
```

Defined in: [lit-ui-router-effect/src/ref-controller.ts:126](https://github.com/simshanith/lit-ui-router/blob/92660184d9980e90964f7e785d5efeb5cae43b42/packages/lit-ui-router-effect/src/ref-controller.ts#L126)

#### Parameters

| Parameter | Type |
| ------ | ------ |
| `host` | [`ReactiveControllerHost`](https://lit.dev/docs/api/controllers/#ReactiveControllerHost) |
| `refs` | [`RefSource`](../type-aliases/RefSource.md)<`Refs`> |
| `selector` | (...`values`) => `T` |
| `options?` | [`RefControllerOptions`](../interfaces/RefControllerOptions.md)<`T`> |

#### Returns

`RefController`<`Refs`, `T`>

## Properties

| Property | Type | Description | Defined in |
| ------ | ------ | ------ | ------ |
|  `value` | `T` | The selected value, for use in `render()`. | [lit-ui-router-effect/src/ref-controller.ts:119](https://github.com/simshanith/lit-ui-router/blob/92660184d9980e90964f7e785d5efeb5cae43b42/packages/lit-ui-router-effect/src/ref-controller.ts#L119) |

## Methods

### hostConnected()

```ts
hostConnected(): void;
```

Defined in: [lit-ui-router-effect/src/ref-controller.ts:140](https://github.com/simshanith/lit-ui-router/blob/92660184d9980e90964f7e785d5efeb5cae43b42/packages/lit-ui-router-effect/src/ref-controller.ts#L140)

Called when the host is connected to the component tree. For custom
element hosts, this corresponds to the `connectedCallback()` lifecycle,
which is only called when the component is connected to the document.

#### Returns

`void`

#### Implementation of

`ReactiveController.hostConnected`

***

### hostDisconnected()

```ts
hostDisconnected(): void;
```

Defined in: [lit-ui-router-effect/src/ref-controller.ts:145](https://github.com/simshanith/lit-ui-router/blob/92660184d9980e90964f7e785d5efeb5cae43b42/packages/lit-ui-router-effect/src/ref-controller.ts#L145)

Called when the host is disconnected from the component tree. For custom
element hosts, this corresponds to the `disconnectedCallback()` lifecycle,
which is called the host or an ancestor component is disconnected from the
document.

#### Returns

`void`

#### Implementation of

`ReactiveController.hostDisconnected`

***

### setRefs()

```ts
protected setRefs(refs): void;
```

Defined in: [lit-ui-router-effect/src/ref-controller.ts:155](https://github.com/simshanith/lit-ui-router/blob/92660184d9980e90964f7e785d5efeb5cae43b42/packages/lit-ui-router-effect/src/ref-controller.ts#L155)

Replaces the refs. A connected controller interrupts its fiber and
re-seeds and re-forks on the new refs, as a reconnect does; a
disconnected one only records them for its next `hostConnected`.

#### Parameters

| Parameter | Type |
| ------ | ------ |
| `refs` | [`RefSource`](../type-aliases/RefSource.md)<`Refs`> |

#### Returns

`void`