Introduction Foundations Components Patterns Directives Pipes Motion Brand

Ai

Cards

Controls

Freelancer domain

Modals

Structure

Text & links

Chat button

Chat button with built in unread count

Use this chat button whenever you want to let the user send a message. It automatically hooks into the online/offline state of the user you want to talk to and displays if there are any unread messages in the thread. When clicked, it will automatically open a chatbox if possible - if it can't, it will redirect to the inbox (note: this won't work on the Bits website because there is no inbox).

Contents

Default Responsive

Without unread messages

With unread messages (this is automatic)

Inputs
contextId : number
contextType : ThreadContextType
otherMemberIds : readonly number[]

Other members of the chat. The online indicator will use the first member in the list

buttonText ?: string = $localize`:Chat button (verb):Chat`
color ?: any = ButtonColor.DEFAULT
disabled ?: boolean = false
display ?: ButtonDisplay = 'inline'
displayDesktop ?: ButtonDisplay
displayTablet ?: ButtonDisplay
fullWidth ?: boolean = false

By default the chat button has a fixed size, setting this to true fits the button to the container width

size ?: any = ButtonSize.SMALL

Size of the button. Automatically adjusts font/notification size.

threadType ?: ThreadType

Override thread type where the default value is PRIVATE if otherMembers length is 1 or GROUP if otherMembers length is greater than 1.