Profile Details

Profile: completeness, verified contacts, fields. Pro · Account and access › Profile and settings

Installation

npx valyro-cli@latest login
npx valyro-cli@latest add profile-details

npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { ProfileDetails } from 'valyro-ui-pro';

Prop	Type	Default
`fields` *	`DescriptionListItem[]`		Profile fields in reading order: name, email, phone, bio.
`completion`	`number`		Share of the profile filled in, 0–1; shows the progress bar.
`memberSince`	`DateInput`		Account creation date, in the footer.
`updatedAt`	`DateInput`		Last profile change, in the footer.
`actions`	`ReactNode`		Buttons in the header: "Edit".
`headingLevel`	`1 \| 2 \| 3 \| 4 \| 5 \| 6`	`2`	Level of the title (default 2).
`locale`	`string`		BCP 47 locale for dates and the percentage.
`labels`	`Partial<ProfileDetailsLabels>`		Overrides for the built-in English text; keys left out keep their defaults.

Address Book — Address book: home, work, default addresses and actions
Social Profiles — Linked social profiles: reorder, verify, copy link
Settings Panel — Settings page: section navigation, unsaved-changes bar, danger zone
Two Factor Setup — Two-factor setup: method, QR code or phone, code verification
Active Sessions — Active sessions: current device, suspicious sign-ins, revoke access
Access Tokens — Personal access tokens: scope, last used, revoke
Age Gate — Age verification: date of birth, remember me, deny under the limit
Permission Matrix — Roles and permissions matrix: inheritance, locks, bulk toggles, draft changes
Audit Log — Activity log: filters, field diffs, CSV export, load more
Privacy Center — Privacy center: score, setting groups, protection counters
Support Center — Support: contact channels with status, tickets with filters