Ink Live Chat Widget Playground

Mock mode — requests go to /api/graphql, handled locally by the mock server.

Session

accountNumber

userEmail

Simulate agent reply

Inject an outbound support message into the mock thread. Send a message in the widget first, keep the chat panel open, then use quick reply or type your own.

Sends a short preset agent message so you can verify replies appear in the widget.

Playground

Locale

locale

Strings

botName

placeholder

emptyCta

emptyMessage

loadingMessages

loadMessagesError

closeConversationDialogTitle

closeConversationDialogBody

closeConversationCancel

closeConversationConfirmButton

closingConversation

closeConversationError

newMessage

newMessages

retry

sendFailed

ARIA labels

ariaLabels.openChat

ariaLabels.close

ariaLabels.closeConfirmDialog

ariaLabels.closeConfirmDismiss

ariaLabels.messageHistory

ariaLabels.minimize

ariaLabels.openEmojiPicker

ariaLabels.scrollToBottom

ariaLabels.send

ariaLabels.typeMessage

ariaLabels.chatPanel

emojiPickerList (JSON array of [emoji, ariaLabel])

Array of pairs: emoji character and short screen-reader label per button.

emojiPickerList

Theme (CSS values)

Pick a built-in preset as the base, then override individual values. Color fields: native picker sets #hex; use the text field for rgb(), var(), etc.

themePreset

bgColor

borderColor

borderRadius

botBubbleBgColor

botBubbleTextColor

fontFamily

fontSize

shadow

stackZIndex

textColor

textColorMuted

triggerEdgeInset

triggerPanelGap

triggerPosition

triggerSize

userBubbleBgColor

userBubbleTextColor

Settings (string numbers, same as HTML attributes)

Milliseconds for intervals; fetch amount is messages per page.

fetchAmountPerRequest

fetchIntervalMs

fetchPreviousThrottleMs

sendErrorDismissMs