Social Elements
Comments, threads, reactions, and social interaction primitives for music platforms, streaming dashboards, and collaborative media tools.
rds-social-coreCopy-pasteMusic-Native
01RdsComment
N
Nafiz M.2 hours ago
The waveform display is exactly what I needed for the podcast player.
L
Lena Rhodes1 hour ago
Agreed — and the transport controls feel very native.
PROPTYPEDEFAULTDESCRIPTION
authorstring—Display name of the comment author.bodystring—Comment text content.avatarUrlstringundefinedOptional avatar image URL. Falls back to author initial.timestampstring | DateundefinedTimestamp shown next to the author name.isOwnbooleanfalseFlips layout to right-align — use for the current user's messages.02RdsCommentThread
N
Nafiz M.3h ago
First release is looking solid.
L
Lena Rhodes2h ago
The AI Elements package pairs really well with this.
F
Fort Echo1h ago
Shipping this to our streaming app next week.
PROPTYPEDEFAULTDESCRIPTION
commentsRdsCommentProps[]—Array of comment objects. Each item accepts all RdsComment props.currentUserIdstringundefinedReserved for future use — ID-based own-comment detection.03RdsCommentInput
PROPTYPEDEFAULTDESCRIPTION
placeholderstring"Write a comment..."Input placeholder text.onSubmit(text: string) => voidundefinedCalled with the trimmed comment text on form submit.isSubmittingbooleanfalseDisables the input and shows a loading state on the send button.04RdsReaction
PROPTYPEDEFAULTDESCRIPTION
emojistring—Emoji or short symbol displayed as the reaction icon.countnumber—Number of users who reacted with this emoji.isActivebooleanfalseHighlights the reaction to indicate the current user has reacted.onClick() => voidundefinedCalled when the reaction button is clicked.05RdsReactionBar
PROPTYPEDEFAULTDESCRIPTION
reactionsRdsReactionProps[]—Array of reaction objects. Each item accepts all RdsReaction props.showAddButtonbooleantrueRenders a + button at the end for adding new reactions.onAddReaction() => voidundefinedCalled when the add reaction button is clicked.06Installation
bash
npm install @meinc/rds-social-coreimport { RdsComment, RdsCommentThread, RdsCommentInput, RdsReaction, RdsReactionBar,} from "@meinc/rds-social-core"