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

# MultiThread Comment Dialog Wireframes

> Wireframe components for building custom MultiThread Comment Dialog interfaces with maximum flexibility.

<Note>
  We recommend that you familiarize yourselves with [UI Customization Concepts](/ui-customization/overview) before attempting to modify any components.
</Note>

## VeltMultiThreadCommentDialogWireframe

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-overview.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=2a5f5971e7083e3af4feac5da7e302d9" alt="" width="1280" height="650" data-path="images/customization/comments/multi-thread/multi-thread-overview.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe>
            <VeltMultiThreadCommentDialogWireframe.CommentCount />
            <VeltMultiThreadCommentDialogWireframe.MinimalFilterDropdown />
            <VeltMultiThreadCommentDialogWireframe.MinimalActionsDropdown />
            <VeltMultiThreadCommentDialogWireframe.NewThreadButton />
            <VeltMultiThreadCommentDialogWireframe.CloseButton />
            <VeltMultiThreadCommentDialogWireframe.List />
            <VeltMultiThreadCommentDialogWireframe.ResetFilterButton />
            <VeltMultiThreadCommentDialogWireframe.ComposerContainer />
        </VeltMultiThreadCommentDialogWireframe>
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-wireframe>
            <velt-multi-thread-comment-dialog-comment-count-wireframe></velt-multi-thread-comment-dialog-comment-count-wireframe>
            <velt-multi-thread-comment-dialog-minimal-filter-dropdown-wireframe></velt-multi-thread-comment-dialog-minimal-filter-dropdown-wireframe>
            <velt-multi-thread-comment-dialog-minimal-actions-dropdown-wireframe></velt-multi-thread-comment-dialog-minimal-actions-dropdown-wireframe>
            <velt-multi-thread-comment-dialog-new-thread-button-wireframe></velt-multi-thread-comment-dialog-new-thread-button-wireframe>
            <velt-multi-thread-comment-dialog-close-button-wireframe></velt-multi-thread-comment-dialog-close-button-wireframe>
            <velt-multi-thread-comment-dialog-list-wireframe></velt-multi-thread-comment-dialog-list-wireframe>
            <velt-multi-thread-comment-dialog-reset-filter-button-wireframe></velt-multi-thread-comment-dialog-reset-filter-button-wireframe>
            <velt-multi-thread-comment-dialog-composer-container-wireframe></velt-multi-thread-comment-dialog-composer-container-wireframe>
        </velt-multi-thread-comment-dialog-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## CommentCount

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-comments-count.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=47a01252f33e85d966256e39103bb824" alt="" width="1280" height="362" data-path="images/customization/comments/multi-thread/multi-thread-comments-count.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.CommentCount />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-comment-count-wireframe></velt-multi-thread-comment-dialog-comment-count-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## MinimalFilterDropdown

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-filter-dropdown.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=d82313e6f1c88246ce2f57e181ac5709" alt="" width="1280" height="362" data-path="images/customization/comments/multi-thread/multi-thread-filter-dropdown.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.MinimalFilterDropdown />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-minimal-filter-dropdown-wireframe></velt-multi-thread-comment-dialog-minimal-filter-dropdown-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## MinimalActionsDropdown

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-actions.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=d5394ca2bd07f31c8f88585452f901a3" alt="" width="1280" height="362" data-path="images/customization/comments/multi-thread/multi-thread-actions.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.MinimalActionsDropdown />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-minimal-actions-dropdown-wireframe></velt-multi-thread-comment-dialog-minimal-actions-dropdown-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## NewThreadButton

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-new-thread.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=0cd3bd0fba00439b3a1aa9398b71b576" alt="" width="1280" height="362" data-path="images/customization/comments/multi-thread/multi-thread-new-thread.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.NewThreadButton />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-new-thread-button-wireframe></velt-multi-thread-comment-dialog-new-thread-button-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## CloseButton

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-close.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=718e2052167abb9b996037df3e008221" alt="" width="1280" height="362" data-path="images/customization/comments/multi-thread/multi-thread-close.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.CloseButton />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-close-button-wireframe></velt-multi-thread-comment-dialog-close-button-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## List

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-list.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=f04c0316a6a9fbae0d04008c05ef2d9a" alt="" width="1280" height="650" data-path="images/customization/comments/multi-thread/multi-thread-list.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.List />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-list-wireframe></velt-multi-thread-comment-dialog-list-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## ResetFilterButton

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-reset-filter.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=7353624dbea9e93539c817b919a791d1" alt="" width="1280" height="650" data-path="images/customization/comments/multi-thread/multi-thread-reset-filter.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.ResetFilterButton />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-reset-filter-button-wireframe></velt-multi-thread-comment-dialog-reset-filter-button-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>

## ComposerContainer

<img src="https://mintcdn.com/velt-mintlify-10684810/4uu9dAPTSHnS9ZxC/images/customization/comments/multi-thread/multi-thread-composer.png?fit=max&auto=format&n=4uu9dAPTSHnS9ZxC&q=85&s=c494dca5d6f96a658bc3782e16825f3c" alt="" width="1280" height="362" data-path="images/customization/comments/multi-thread/multi-thread-composer.png" />

<Tabs>
  <Tab title="React / Next.js">
    ```jsx theme={null}
    <VeltWireframe>
        <VeltMultiThreadCommentDialogWireframe.ComposerContainer />
    </VeltWireframe>
    ```
  </Tab>

  <Tab title="Other Frameworks">
    ```html theme={null}
    <velt-wireframe style="display:none;">
        <velt-multi-thread-comment-dialog-composer-container-wireframe></velt-multi-thread-comment-dialog-composer-container-wireframe>
    </velt-wireframe>
    ```
  </Tab>
</Tabs>
