# toastStack

> Keeps a toast region's `--ui-toast-front-size` equal to the newest toast's height, so folded toasts behind it peek out by the same amount whatever their own length.

```ts
import { toastStack } from "@sdxc/ui/app";
```

Measures the region's last child (the toast in front) whenever it changes
size or a toast arrives or leaves, writing its height onto the region.

## Signature

```ts
toastStack(): MixinDescriptor<
	HTMLElement,
	[callback: (node: HTMLElement, signal: AbortSignal) => void],
	ElementProps
>
```

Returns: A mixin ready for a toast region's `mix` prop.

## Examples

```tsx
<div data-slot="region" mix={[toastStack()]}>{toasts}</div>
```