# Import Sources block

> Import services settings step with selectable integration cards and a 2-pick limit

Wizard step to import data from third-party services. Selectable integration cards with logo, status badge, and checkbox, capped at 2 picks via a toast, with back and next. ReUI Badge, Frame; shadcn Card, Checkbox, Button. Connect integrations.

- Type: Pro block
- Category: [Settings](https://web.dev.reui.io/blocks/application/settings.md)
- Page: https://web.dev.reui.io/blocks/application/settings/settings-1
- MCP: `get_block("settings-1")`
- Built with: Badge, Button, Card, Checkbox, Field, Frame, Item
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## Best for

Import sources capped at 2 picks of 9, with a warning toast past the cap and the pick count on the Next step button

## Agent notes

- Replace `SERVICES`; each `status` picks the Easy Import or 2-Step Import badge and `logo` holds the brand mark
- Go back and Next step have no handler, so wire them to your wizard and submit the ids held in `selected`
- The cap lives in `MAX_SELECTED_SERVICES`, but the toast title and header copy hard-code 2, so change all three

## When not to use

- A multi-step flow with a stepper and per-step validation, not one picker step: use [Billing Setup](https://web.dev.reui.io/blocks/application/wizard/wizard-1.md) (`get_block("wizard-1")`)
- A single choice among a few options such as plan tiles, not several picks from a grid: use [Radio Group](https://web.dev.reui.io/components/radio-group.md) (`get_component("radio-group")`)

## 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/settings-1
```

## About Settings blocks

### When to use

- Preference pages of labeled rows, each row carrying its own switch, select, input or button
- Integration pages that pick, connect or configure third party apps, webhook routes and API keys
- Account, security, notification channel and role permission policies

### When not to use

- A new record to fill in and submit, such as an invoice, a product or a member invite: use the [Form blocks](https://web.dev.reui.io/blocks/application/form.md)
- A billing page with usage counters and an invoice table, or a referral rewards page: use the [Profile blocks](https://web.dev.reui.io/blocks/application/profile.md)
- The sidebar navigation that wraps every page of a product, the settings page included: use the [App Shell blocks](https://web.dev.reui.io/blocks/application/app-shell.md)

### Agent notes

- Each page.tsx centers the root in a padded `min-h-svh` wrapper and each root caps its own max width; remove both inside your settings route
- Nothing is saved and no block calls an API, so wire every button and control, including any `useState` or `defaultChecked` value, to your settings API

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.