Vertical stacking for SuggestedActions

[pradeeprajendran]

Is there a way to stack suggested actions be vertically stacked instead of a 'wrap around' carousel? If not, can there be one in the future? :)

[corinagum]

Hi @pradeeprajendran, Do you want the suggested action to be stacked vertically? Or do you want the non-fitting suggested actions in the horizontal display to stack?

If you mean the former, have you considered using Hero card card actions? This will make the list vertical and be sent as a 'normal' activity. Otherwise I don't believe this is a feature Web Chat wants to support. There are a lot of UX considerations that make changing the stacking procedure complicated. That discussion has just been filed and can be tracked on #1839. However, you can implement your own components. Please take a look at 10.a.customization-card-components

If you mean the latter, where the left and right flippers will no longer be necessary, but the buttons will list horizontally and stack vertically if it does not fit on the first line, then this is a feature we have not yet considered. I am adding design to see if this is a customization we want to implement.

[pradeeprajendran]

Hey @corinagum thanks for the response. I was thinking Hero cards but want to leverage the "retry prompts" for suggested actions instead. I do like the idea of buttons listing horizontally and then will stack vertically if it doesn't fit in the first line. The left and right flippers can be a bit UX unfriendly for mobile users.

[Unders0n]

Guys any update on this? I would appreciate any of the solutions (stacking and just vertical) , the one that implemented now i think is the worst. Can we have an option to make this without herocards?

[corinagum]

@Unders0n vertical stacking has been available since 4.7. Please feel free to use it!

[Unders0n]

@corinagum can you please guide me on how to do that (if that's important - for webchat control). Wasn't able to google that

[corinagum]

@Unders0n please take your implementation questions to Stack Overflow. Thanks!