# Team Invitations block

> Three step team invitation wizard with per-row role assignment and pre-send review

Add member emails with inline validation and per-row roles, set sender and expiry, then review a recipients table and send-readiness checks before queuing. ReUI Stepper, Frame, Badge plus shadcn Table, Select, Avatar. For onboarding and seat invites.

- Type: Pro block
- Category: [Wizard](https://web.dev.reui.io/blocks/application/wizard.md)
- Page: https://web.dev.reui.io/blocks/application/wizard/wizard-5
- Docs (Base UI): https://web.dev.reui.io/docs/components/base/stepper.md
- Docs (Radix UI): https://web.dev.reui.io/docs/components/radix/stepper.md
- MCP: `get_block("wizard-5")`
- Built with: Alert, Avatar, Badge, Button, Field, Frame, Input, Item, Select, Separator, Spinner, Stepper, Table, Textarea
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## Best for

Email rows with a role each and a live Ready, Needs role or Invalid email badge, ending in a queued state with a New batch reset

## Agent notes

- `DEFAULT_INVITEES` holds 3 sample teammates with Unsplash avatars; `INVITE_ROLES` and `EXPIRATION_OPTIONS` define the role and expiry choices
- `submitInvites` waits 700 ms, then shows a `toast` and sets `isComplete`; nothing is sent, so post `invitees` there
- `REVIEW_CHECKS` is static copy, and only its `emails` and `access` rows turn to a warning, from the invitee statuses

## When not to use

- Importing many rows from a CSV file with column mapping: use [CSV Import](https://web.dev.reui.io/blocks/solutions/crm/solution-crm-6.md) (`get_block("solution-crm-6")`)
- A vendor file with owner rows and an attestation: use [Vendor Onboarding](https://web.dev.reui.io/blocks/application/wizard/wizard-2.md) (`get_block("wizard-2")`)

## Third-party libraries

- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started)

## Install

```bash
npx shadcn@latest add @reui/wizard-5
```

## About Wizard blocks

### When to use

- Money tasks done in steps: account billing setup, sending an invoice, a seat upgrade or a fund transfer
- Admin intake in steps: a vendor compliance file, a store product with variants or a batch of team invites
- A long form split into 3 to 5 numbered steps with previous and next buttons and a summary before submit

### When not to use

- A first run setup right after signup that collects a profile, a role and goals: use the [Onboarding blocks](https://web.dev.reui.io/blocks/application/onboarding.md)
- Only numbered step markers and panel switching around fields you already built: use [Stepper](https://web.dev.reui.io/components/stepper.md) (`get_component("stepper")`)
- A shopper paying for a cart, entering shipping and card details beside an order summary: use the [Checkout blocks](https://web.dev.reui.io/blocks/ecommerce/checkout.md)

### Agent notes

- Steps come from `WIZARD_STEPS`, `PRODUCT_STEPS` or `PAYMENT_STEPS` in the data file, and each step id has its own render branch; add both for a new step
- No step calls an API: the final button shows a sonner `toast`, sets local state such as `isIssued`, or both; post the collected values from that handler
- Each page.tsx sets a `min-h-svh` wrapper and the full screen variants size their root to the viewport too; remove both inside an app shell or dialog

Every ReUI item has a twin like this one; the index is https://web.dev.reui.io/llms.txt. Agents with the ReUI MCP (https://web.dev.reui.io/docs/mcp) get the same guidance from the getters named above.