ProfilePanel

Profile-detail layout for members, people, and agents, built from the shared Panel foundation.

Preview#

<ProfilePanel>
  <ProfilePanelHeader>
    <Avatar />
    <ProfilePanelHeaderContent>
      <PanelHeading>
        <PanelTitle />
      </PanelHeading>
      <PanelMeta />
    </ProfilePanelHeaderContent>
    <PanelActions>
      <PanelAction />
    </PanelActions>
  </ProfilePanelHeader>
  <PanelBody>
    <PanelScrollViewport>
      <PanelScrollContent>
        <ProfilePanelSection>
          <Avatar />
          <Text.Heading />
          <Text.Mono />
        </ProfilePanelSection>
        <ProfilePanelSection>
          <DescriptionList>
            <DescriptionItem>
              <DescriptionTerm />
              <DescriptionDetails>
                <Badge />
              </DescriptionDetails>
            </DescriptionItem>
          </DescriptionList>
        </ProfilePanelSection>
        <ProfilePanelSection>
          <SidebarItem />
        </ProfilePanelSection>
      </PanelScrollContent>
    </PanelScrollViewport>
  </PanelBody>
</ProfilePanel>

Loading#

Skeleton#

Remote human#

Remote agent profile#

API#WIP

PropTypeDefaultDescription
...propsPanelPropsProfile-detail specialization of Panel. Owns the full-height frame and profile surface without changing Panel scrolling behavior.
PropTypeDefaultDescription
...propsPanelHeaderPropsProfile identity header with the profile-specific Elegant separator and inline padding.
PropTypeDefaultDescription
...propsPanelHeaderContentPropsProfile identity stack that keeps the name and secondary description vertically arranged across themes.
PropTypeDefaultDescription
...propsPanelBodyPropsScrollable body region for profile sections.
PropTypeDefaultDescription
...propsPanelSectionPropsProfile content section with profile-specific Elegant spacing and separator color.