amazon-connect / amazon-connect-chat-ui-examples

Examples of how to create and customize the customer side chat for Amazon Connect
Other
147 stars 214 forks source link

Problem with Custom widget window sizing #183

Closed tisdaled closed 7 months ago

tisdaled commented 7 months ago

Hello,

We have implemented the customChatWidget code into our SalesForce Lightning instance and would like to change the size of the interface. We would like to make the overall widget size larger and increase the interactive space to make reading responses easier. At this point, we have ended up with a widget that has a large blank space at the bottom or we end up with slider bars because it looks like the content is larger than the actual window size.

What we need to know is how to use all of the available space within the current window size or how to increase the overall width and height to allow for a larger workspace for our customers to use when chatting with our bot.

Thanks in advance for your help.

spenlep-amzn commented 7 months ago

Hi @tisdaled ,

If you want to customize the customChatWidget code, you can edit the styled.js file [LINK]. You can fully customize this code or re-write it.

Here is an example PR: https://github.com/amazon-connect/amazon-connect-chat-ui-examples/pull/195/files.

customChatWidget embeds an iframe, and renders the amazon-connect-chat-interface UI code. If resizing the customChatWidget containers isn't enough, you can fork the chat-interface open source code as well, and generate a new bundle file (and use it by copy/pasting here)

Going to resolve this issue. Please feel free to re-open if you have further questions, or there is a bug with ui-examples code.

Thanks -Spencer