Profile

UI element that summarizes a particular user.

In Progress (Unreleased)
Twig Usage
{% include '@bolt-components-profile/profile.twig' with {
  first_name: 'First',
  last_name: 'Last',
  username: 'username',
  job_title: 'Lead System Architect',
  location: 'United States',
} only %}
Schema
Note: when assigning component props as HTML attributes on a web component, make sure to use kebab-case.
Prop Name Description Type Default Value Option(s)
attributes

A Drupal attributes object. Applies extra HTML attributes to parent container.

object
avatar

Render a custom avatar image.

any
cover

Render a custom cover image.

any
first_name

Render first name of the user.

any
last_name

Render last name of the user.

any
username

Render username of the user.

any
job_title

Render job title of the user.

any
location

Render location of the user.

any
actions

Render user actions. Icon-only button elements are expected here.

any
chips

Render chips based on user info. Chip components (no Chip List) are expected here.

any
full_bleed

Set the profile to expand the full viewport. Use this prop for building a profile header for a particular page.

boolean false
Install Install
npm install @bolt/components-profile
Dependencies @bolt/core-v3.x