Skip to main content

Spotify Message

SpotifyMessage Component

Kursat

Example Usage

import { SpotifyMessage } from "react-chat-elements"

<SpotifyMessage
uri="spotify:artist:6UBA15slIuadJ8h2lPRPos"
/>

Result

Spotify Message with Message Box

Message Box

It is enough to define a message component with using "MessageBox".

However you have to specify type for them.

import { MessageBox } from "react-chat-elements"

<MessageBox
position="left"
type="spotify"
title="Esra"
uri="spotify:artist:53XhwfbYqKCa1cC15pYq2q"
/>

Result

Esra

SpotifyMessage Props (extends IMessage)

propdefaulttypedescription
urinonestringspotify url
widthnonenumber | stringThe Spotify Message's width and optional.
heightnonenumber | stringThe Spotify Message's height and optional.

IMessage Props

propsdefaulttypedescription
idnonestring | numbermessage id
positionnonestringmessage position
textnonestringmessage text
titlenonestringmessage title
focusnonebooleanmessage focus
datenonenumber | Datemessage date
dateStringnonestringmessage date string
avatarnonestringmessage avatar
titleColornonestringmessage title color
forwardednonebooleanmessage forwarded
replyButtonnonebooleanmessage reply button
removeButtonnonebooleanmessage remove button
statusnone'waiting'| 'sent' | 'received' | 'read'message status
statusTitlenonestringmessage status title
notchnonebooleanmessage notch
copiableDatenonebooleanmessage copiable date
retractednonebooleanmessage retracted
classNamenonestringmessage className
letterItemnoneobjectmessage letterItem contains id:string, letter:ReactChild
replynoneobject | anymessage reply should be both any and object (contains message:string, photoURL:string)
typenonestringmessage type