Profile Card

Профиль пользователя. Pro · Контент и соцсети › Соцсети

Установка

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

npm install valyro-ui-pro

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

Пропсы

Prop	Type	Default
`name` *	`string`		Display name; also the card's accessible name and the avatar's initials.
`handle` *	`string`		Username shown as "@handle"; also seeds the generated cover.
`avatarSrc`	`string`		Avatar image URL; initials of `name` are shown without it.
`verified`	`boolean`		Adds a verified badge after the name.
`bio`	`string`		Short description under the handle.
`location`	`string`		Place shown with a pin icon (vertical layout only).
`website`	`{ label: string; href?: string }`		Website line (vertical layout only); a link opening in a new tab when `href` is set.
`joined`	`DateInput`		Join date (Date, ISO string or epoch ms), shown as "Joined" month and year (vertical layout only).
`stats`	`ProfileStats`		Counts in compact form; only the given ones are shown. The horizontal layout shows followers only.
`coverSrc`	`string`		Cover image URL; falls back to a generated gradient.
`coverSeed`	`string`		Seed for the generated cover gradient (defaults to the handle).
`following`	`boolean`		Whether the viewer follows this profile.
`defaultFollowing`	`boolean`	`false`	Initial `following` when uncontrolled.
`onFollowingChange`	`(following: boolean) => void`		Called with the new `following` when it changes.
`onMessage`	`() => void`		Shows the message button.
`layout`	`'vertical' \| 'horizontal'`	`'vertical'`	`horizontal` is a compact row for lists and suggestions.
`locale`	`string`		Locale for counts and dates (default: the ThemeProvider's, then the browser's).
`labels`	`Partial<ProfileCardLabels>`		Overrides for the built-in English text; keys left out keep their defaults.

Profile Card

Установка

Пропсы

Похожие компоненты