TreeView description below label

Question

Using mui-x TreeView component, I would like to show some text below the label of the TreeItem. Starting with this example, I add the "Lorem ipsum..." text...

    <TreeItem2Provider itemId={itemId}>
      <TreeItem2Root {...getRootProps(other)}>
        <CustomTreeItemContent {...getContentProps()}>
          <TreeItem2IconContainer {...getIconContainerProps()}>
            <TreeItem2Icon status={status} />
          </TreeItem2IconContainer>
          <Box sx={{ flexGrow: 1, display: "flex", gap: 1 }}>
            <Avatar
              sx={(theme) => ({
                background: theme.palette.primary.main,
                width: 24,
                height: 24,
                fontSize: "0.8rem",
              })}
            >
              {(label as string)[0]}
            </Avatar>
            <TreeItem2Label {...getLabelProps()} />
          </Box>
        </CustomTreeItemContent>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit
        {children && <TreeItem2GroupTransition {...getGroupTransitionProps()} />}
      </TreeItem2Root>
    </TreeItem2Provider>

I want that text to be contained within the item eg: Amelia Hart, meaning I don't want it to display unless Amelia Hart is expanded. Above code displays the text whenever the label Amelia Hart is visible (collapsed or not)...

Moving the text within <CustomTreeItemContent> incorrectly showing text to the right...

Moving the text within TreeItem2GroupTransition correctly only shows when expanded, but replaces the child TreeItems that should show; Jane Fisher in this case...

This is what I want it to look like (this image is edited to be the desired output)...