module@warp-drive/ember

Component <Await />

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

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 rethrown asynchronously (a tick after the render that observed the rejection) instead of crashing the current render. It remains an uncaught error that crash-reporting instrumentation can observe. Prefer providing an <:error> block -- the template-require-request-error-block ESLint rule flags a missing one statically.

Extends

• default<AwaitSignature<T, E>>

Type Parameters

T

T

E

E

Constructors

Constructor

new Await<T, E>(owner: Owner, args: {
  promise:   | Promise<T>
     | Awaitable<T, E>;
}): 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:384

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:387

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:381

The reactive PromiseState for the awaited promise.

Returns

Readonly<PromiseState<T, E>>