WallReplies
Wall
The Wall category provides a complete social feed system. XAWallFeed is the top-level orchestrator; it renders pinned and regular post lists, delegates search/filter to a toolbar, and shows appropriate empty or loading states. Individual posts are rendered by XAWallPost. The remaining components — XAWallInput, XAWallReplies, XAWallReactions, and XAWallTags — can be composed independently or are automatically used inside XAWallFeed and XAWallPost.
Components
<XAWallReplies />
An animated, expandable reply thread. Renders up to maxVisible replies using XAWallPost at size="sm", shows a "Show N more" button when there are additional replies, and emits load-more for server-side pagination. Accepts a #input slot for the reply composer and a #reply-actions scoped slot for per-reply controls.
<XAWallReplies
:replies="post.replies"
:expanded="isExpanded"
:total-count="post.replyCount"
:max-visible="3"
@update:expanded="isExpanded = $event"
@load-more="loadMoreReplies"
@react="handleReplyReaction"
>
<template #input>
<XAWallInput v-model="replyBody" submit-text="Reply" @submit="submitReply" />
</template>
</XAWallReplies>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
replies | Array | [] | Array of reply post objects. |
expanded | Boolean | false | Controls visibility via v-model. |
maxVisible | Number | 3 | Number of replies shown before a "show more" button appears. |
loading | Boolean | false | Shows a spinner inside the section. |
totalCount | Number | null | Total reply count for computing "show N more" (falls back to replies.length). |
Events
| Event | Description |
|---|---|
update:expanded | Collapse/expand state changed. |
load-more | User clicked "Show N more replies". |
react | Reaction toggled on a reply. |
tag-click | Tag clicked on a reply. |
attachment-click | Attachment clicked on a reply. |
AI Context
component: XAWallReplies
package: "@xenterprises/nuxt-x-app"
auto-import: true
prefix: XA
category: Wall
use-when: Adding a threaded, expandable reply section beneath a XAWallPost. Use the #input slot for XAWallInput as the reply composer. Supports server-side pagination via load-more event.