Customize the message field

You can control whether or not the message field is shown to a user.

By default, the message field is visible. To hide the message field, set the message-field-visible property to false, for example:

1<t-chatbox
2  app-id="<APP_ID>"
3  user-id="sample_user_alice"
4  conversation-id="sample_conversation"
5  [message-field-visible]="false"
6/>

You can control the placeholder text that's shown in the message field before the user has entered a message. By default, the placeholder text is "Say something...", or a translation of that phrase into the user's local language.

To override the default placeholder text, use the message-field-placeholder property. For example:

1<t-chatbox
2  app-id="<APP_ID>"
3  user-id="sample_user_alice"
4  conversation-id="sample_conversation"
5  message-field-placeholder="What's happening?"
6/>

You can control whether the message field is subject to spellchecking by the user's browser or operating system. By default, spellcheck is turned off.

To enable or turn off spellcheck for the message field, use the message-field-spellcheck property. For example, to turn on spellchecking:

1<t-chatbox
2  app-id="<APP_ID>"
3  user-id="sample_user_alice"
4  conversation-id="sample_conversation"
5  [message-field-spellcheck]="true"
6/>

Note that enabling spellcheck may also turn on autocorrect on some mobile devices.

You can control whether a user can send a message by tapping the Enter key, with the enter-sends-message property. By default, tapping Enter sends a message.

To turn off using the Enter key to send a message, you can set the following:

1<t-chatbox
2  app-id="<APP_ID>"
3  user-id="sample_user_alice"
4  conversation-id="sample_conversation"
5  [enter-sends-message]="false"
6/>

When set to false, the only way for a user to send a message is by tapping the Send button.