> ## Documentation Index
> Fetch the complete documentation index at: https://velt.dev/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Inline Comments Section Primitives

> Primitive-based components for building custom Inline Comments Section interfaces with maximum flexibility.

### VeltInlineCommentsSectionCommentCount

Comment count display for the inline comments section.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionCommentCount annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-comment-count annotation-id="abc123"></velt-inline-comments-section-comment-count>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionComposerContainer

Composer container for the inline comments section.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionComposerContainer annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-composer-container annotation-id="abc123"></velt-inline-comments-section-composer-container>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionList

List container for inline comments.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionList annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-list annotation-id="abc123"></velt-inline-comments-section-list>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionPanel

Panel container for the inline comments section.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionPanel annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-panel annotation-id="abc123"></velt-inline-comments-section-panel>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSkeleton

Loading skeleton for the inline comments section.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSkeleton annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-skeleton annotation-id="abc123"></velt-inline-comments-section-skeleton>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdown

Complete filter dropdown for the inline comments section.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdown annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown annotation-id="abc123"></velt-inline-comments-section-filter-dropdown>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownTrigger

Trigger button for the inline comments section filter dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownTrigger annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-trigger annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-trigger>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownTriggerArrow

Arrow indicator for the inline comments section filter dropdown trigger.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownTriggerArrow annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-trigger-arrow annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-trigger-arrow>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownTriggerName

Name display for the inline comments section filter dropdown trigger.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownTriggerName annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-trigger-name annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-trigger-name>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownContent

Content container for the inline comments section filter dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownContent annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-content annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-content>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownContentList

List container within the inline comments section filter dropdown content.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownContentList annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-content-list annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-content-list>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownContentListItem

Individual list item within the inline comments section filter dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownContentListItem annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-content-list-item annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-content-list-item>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownContentListItemCheckbox

Checkbox within a filter dropdown list item.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownContentListItemCheckbox annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-content-list-item-checkbox annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-content-list-item-checkbox>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionFilterDropdownContentListItemLabel

Label within a filter dropdown list item.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionFilterDropdownContentListItemLabel annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-filter-dropdown-content-list-item-label annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-content-list-item-label>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### velt-inline-comments-section-filter-dropdown-content-apply-button

Apply button within the inline comments section filter dropdown content. HTML-only in this release.

```html theme={null}
<velt-inline-comments-section-filter-dropdown-content-apply-button annotation-id="abc123"></velt-inline-comments-section-filter-dropdown-content-apply-button>
```

**Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).

***

### VeltInlineCommentsSectionSortingDropdown

Complete sorting dropdown for the inline comments section.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdown annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownTrigger

Trigger button for the inline comments section sorting dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownTrigger annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-trigger annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-trigger>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownTriggerIcon

Icon for the inline comments section sorting dropdown trigger.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownTriggerIcon annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-trigger-icon annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-trigger-icon>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownTriggerName

Name display for the inline comments section sorting dropdown trigger.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownTriggerName annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-trigger-name annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-trigger-name>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownContent

Content container for the inline comments section sorting dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownContent annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-content annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-content>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownContentItem

Individual sort option item within the sorting dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownContentItem annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-content-item annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-content-item>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownContentItemIcon

Icon for a sort option item in the sorting dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownContentItemIcon annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-content-item-icon annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-content-item-icon>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownContentItemName

Name label for a sort option item in the sorting dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownContentItemName annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-content-item-name annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-content-item-name>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>

***

### VeltInlineCommentsSectionSortingDropdownContentItemTick

Tick/checkmark for the active sort option item in the sorting dropdown.

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltInlineCommentsSectionSortingDropdownContentItemTick annotationId="abc123" />
    ```

    **Props:** Common inputs only (see [Common Inputs](#common-inputs) section).
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-inline-comments-section-sorting-dropdown-content-item-tick annotation-id="abc123"></velt-inline-comments-section-sorting-dropdown-content-item-tick>
    ```

    **Attributes:** Common attributes only (see [Common Inputs](#common-inputs) section).
  </Tab>
</Tabs>