# @askrjs/askr/control

> Published API exports for @askrjs/askr/control.

Source: [https://askrjs.com/docs/reference/api/askr/control](https://askrjs.com/docs/reference/api/askr/control)

Status: stable. Packages: @askrjs/askr/control.

**Published packages are authoritative.** Examples may lag behind a published contract. When guidance differs, verify the exports and TypeScript declarations in your installed package, then file an issue.

## Exports

This entrypoint publishes 8 exports from the declarations shipped by @askrjs/askr.

### `Case`

```ts
Case: (props: CaseProps) => JSXElement
```

Render the first matching {@link Match} child (by `when`), or `fallback` if none match.

### `CaseProps`

```ts
CaseProps: {
  fallback?: BoundaryChild;
  children?: unknown;
}
```

Props for {@link Case}.

- `children`: children?: unknown;

- `fallback`: fallback?: RenderableChild;

### `For`

```ts
For: <T, K extends string | number = string | number>(props: ForProps<T, K>) => JSXElement
```

Render a keyed or indexed list, reconciling items by key instead of position.

### `ForProps`

```ts
ForProps: KeyedForProps<T, K> | IndexedForProps<T>
```

Props for {@link For}.

- `by`: by?: ((item: T, index: number) => K) | undefined;

- `byIndex`: byIndex?: true | undefined;

- `children`: Row renderer. Parent reactive reads must use `selector()` or thunk props;
closure-captured values are snapshotted when the row is created or
reconciled; changing the parent source does not rerun an existing row.

- `each`: each: ForEachSource<T>;

- `fallback`: fallback?: RenderableChild;

### `Match`

```ts
Match: (_props: MatchProps) => null
```

Declares one branch of a {@link Case}; only valid as its direct child.

### `MatchProps`

```ts
MatchProps: {
  key?: string | number | null;
  when: unknown;
  children: MatchChild;
}
```

Props for {@link Match}, valid only as a direct child of {@link Case}.

- `children`: children: MatchChild;

- `key`: key?: string | number | null | undefined;

- `when`: when: unknown;

### `Show`

```ts
Show: <T>(props: ShowProps<T>) => JSXElement
```

Conditionally render children based on `when`, narrowing truthy values for the render function form.

### `ShowProps`

```ts
ShowProps: {
  when: ShowSource<T>;
  fallback?: BoundaryChild;
  children: BoundaryChild | ((value: Truthy<T>) => BoundaryChild);
}
```

Props for {@link Show}.

- `children`: children: RenderableChild | ((value: Truthy<T>) => BoundaryChild);

- `fallback`: fallback?: RenderableChild;

- `when`: when: ShowSource<T>;

## Documentation navigation

[Previous](https://askrjs.com/docs/reference/api/askr/components/index.md) | [Next](https://askrjs.com/docs/reference/api/askr/foundations/index.md)
