module@warp-drive/ember/index

Component <Await />

Defined in: warp-drive-packages/ember/dist/index.d.ts:366

The <Await /> component allow you to utilize reactive control flow for asynchronous states in your application.

Await is ideal for handling "boundaries", outside which some state is still allowed to be unresolved and within which it MUST be resolved.

import { Await } from '@warp-drive/ember';

<template>
  <Await @promise={{@request}}>
    <:pending>
      <Spinner />
    </:pending>

    <:error as |error|>
      <ErrorForm @error={{error}} />
    </:error>

    <:success as |result|>
      <h1>{{result.title}}</h1>
    </:success>
  </Await>
</template>

The <Await /> component requires that error states are properly handled.

If no error block is provided and the promise rejects, the error will be thrown.

Extends

• default<AwaitSignature<T, E>>

Type Parameters

T

T

E

E

Constructors

Constructor

new Await<T, E>(owner, args): Await<T, E>;

Defined in: node_modules/.pnpm/@[email protected]/node_modules/@glimmer/component/dist/index.d.ts:389

Parameters

owner

Owner

args

promise

| Promise<T> | Awaitable<T, E>

Returns

Await<T, E>

Inherited from

Component<AwaitSignature<T, E>>.constructor

Properties

error

Get Signature

get error(): E;

Defined in: warp-drive-packages/ember/dist/index.d.ts:372

The rejection reason, once state has errored.

Returns

E

---

result

Get Signature

get result(): T;

Defined in: warp-drive-packages/ember/dist/index.d.ts:375

The resolved value, once state has succeeded.

Returns

T

---

state

Get Signature

get state(): Readonly<PromiseState<T, E>>;

Defined in: warp-drive-packages/ember/dist/index.d.ts:369

The reactive PromiseState for the awaited promise.

Returns

Readonly<PromiseState<T, E>>