<VeltWireframe>
    <VeltCommentPinWireframe>
        {/* Ghost Comment Indicator */}
        <VeltCommentPinWireframe.GhostCommentIndicator/>
        {/* Index */}
        <VeltCommentPinWireframe.Index/>
        {/* Private Comment Indicator */}
        <VeltCommentPinWireframe.PrivateCommentIndicator/>
        {/* Triangle */}
        <VeltCommentPinWireframe.Triangle/>
        {/* Unread Comment Indicator */}
        <VeltCommentPinWireframe.UnreadCommentIndicator/>
    </VeltCommentPinWireframe>
</VeltWireframe>

We recommend that you familiarize yourselves with Advanced UI Customization Concepts before attempting to modify any components.

Default Component

There are 5 Subcomponents within the Comment Pin component.

4 of them are Hidden Elements, which means they don’t appear initially in the default state, but may appear upon interacting with the component.

Subcomponents

  1. Ghost Comment Indicator

<VeltCommentPinWireframe.GhostCommentIndicator/>
  1. Index

<VeltCommentPinWireframe.Index/>
  1. Private Comment indicator

<VeltCommentPinWireframe.PrivateCommentIndicator/>
  1. Triangle

<VeltCommentPinWireframe.Triangle/>
  1. UnreadCommentIndicator

<VeltCommentPinWireframe.UnreadCommentIndicator/>