# Shadcn Profile blocks

> User profile pages with avatars, bios, activity feeds, and account management sections.

- Type: Pro blocks (Application)
- Page: https://web.dev.reui.io/blocks/application/profile
- Blocks: 10
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## When to use

- Account areas that switch profile, workspace, team, billing or access panels from tabs or a sidebar
- A personal profile edit page: avatar, name, verified email, username, phone and regional preferences
- An account subpage for one job: sender mailboxes, alerts, referrals, meeting capture, billing or API keys

## When not to use

- One panel of switch rows or integration cards, with no personal identity fields: use the [Settings blocks](https://web.dev.reui.io/blocks/application/settings.md)
- Entering a new record, such as an invoice with line items or a product listing: use the [Form blocks](https://web.dev.reui.io/blocks/application/form.md)
- The outer navigation layout around every page of a product, beyond account pages: use the [App Shell blocks](https://web.dev.reui.io/blocks/application/app-shell.md)

## Agent notes

- Each page.tsx wraps `Profile` in its own padding and centering; render `Profile` alone inside your layout

## Third-party libraries

- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started), used by 6 of 10 blocks
- React Phone Number Input v3: [API reference](https://catamphetamine.gitlab.io/react-phone-number-input/docs/index.html#phoneinputwithcountry), [docs](https://gitlab.com/catamphetamine/react-phone-number-input), used by 3 of 10 blocks
- TanStack Table v9: [API reference](https://tanstack.com/table/v9/docs/framework/react/reference/index), [docs](https://tanstack.com/table/v9/docs/framework/react/quick-start), used by 2 of 10 blocks
- Shiki v4: [API reference](https://shiki.style/guide/install), [docs](https://shiki.style/guide/), used by 1 of 10 blocks
- Base UI v1: [API reference](https://base-ui.com/react/components), [docs](https://base-ui.com/react/overview/quick-start), [llms.txt](https://base-ui.com/llms.txt), used by 1 of 10 blocks

## Blocks

- [Account & Team Settings](https://web.dev.reui.io/blocks/application/profile/profile-1.md): Account settings shell with vertical sidebar tabs for profile, workspace, team, and billing. Best for a vertical tab rail over 4 panels, with a searchable team DataGrid, a status filter with counts and 3 seat size cards.
- [Admin Permissions](https://web.dev.reui.io/blocks/application/profile/profile-2.md): Admin settings page with line tabs spanning profile, members, permissions, and integrations. Best for a 6 section line tab strip with an Owner, Admin and Editor permission matrix and integration rows with status badges and menus.
- [Personal Profile](https://web.dev.reui.io/blocks/application/profile/profile-3.md): Profile settings form with avatar upload, verified email, and regional preferences in a single card. Best for a single untabbed card with a 2 column identity grid, label hint tooltips, an inline email Edit and a time format select.
- [Mailbox Accounts](https://web.dev.reui.io/blocks/application/profile/profile-4.md): Outreach inbox account settings page with connected mailboxes, reply routing, and signature toggles. Best for mailbox rows with provider logos, reply routing rows with avatars, row action menus, 2 connect buttons and signature switches.
- [Notification Digest](https://web.dev.reui.io/blocks/application/profile/profile-5.md): Notification settings with daily digest controls and a per-channel email and in-app alert matrix. Best for a morning digest strip of time, channel and scope with progress bars over 6 alert events checked per Email and In App.
- [Referral Rewards](https://web.dev.reui.io/blocks/application/profile/profile-6.md): Partner referral rewards profile with copy-link share card, reward tier ladder, referral activity. Best for a copyable invite link and note, qualification rules, a 3 tier reward ladder and recent referrals with an export button.
- [Meeting Capture](https://web.dev.reui.io/blocks/application/profile/profile-7.md): Meeting Capture Settings Card with Recording Mode, Consent, Notes Template, and Output Toggles. Best for a single meeting recorder card whose selects describe each option, with a notes prompt, output checkboxes and a timed Save spinner.
- [Billing Settings](https://web.dev.reui.io/blocks/application/profile/profile-8.md): Billing settings page with plan summary, 3-column usage metrics, and invoice history table. Best for a blocked renewal alert above plan facts, 3 usage counters, a missing card badge in billing details and an invoice table with downloads.
- [Account Settings Hub](https://web.dev.reui.io/blocks/application/profile/profile-9.md): Account settings hub with grouped collapsible sidebar navigation and 11 swappable form panels. Best for security and developer panels such as sessions, webhooks and audit retention, under a Sidebar of 3 collapsible groups with menu badges.
- [Developer API Keys](https://web.dev.reui.io/blocks/application/profile/profile-10.md): Developer API keys page with masked token copy, roll and revoke, and 5 language SDK samples. Best for an API key list with create, roll, revoke and delete in local state, Undo toasts, a Secret or Publishable choice and tabbed SDK samples.

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.