extract bubble from chatwizard

[ctopCanada]

add corresponding css for bubble add tutorial for open attribute. add open action in action manager

close #1725

[GormFrank]

Approved upon testing.

[GormFrank]

@ctopCanada Please fix build related issues, and then we'll test.

[duboisp]

Here a build version based on the latest commit as today: https://universallabs.org/wet/labs/pr1730-as-2020-11-24.zip

[duboisp]

• On extra-small view port, (xsmallview) the vertical alignment of the "X" is off, it need to be centered at least for the default font size.
• The bubble don't properly anchor into the page, it lock before its reserved area.
• The focus need to return back to the button after the overlay is closed. This issue seem to be related to the action manager not the bubble JS/CSS.

[duboisp]

For the focus order related to when the overlay is closed, we can mitigate it by adding instruction into the action manager for the "open overlay" action. A sentence like: "The overlay markup must be next to the button in order to ensure a proper focus order when the overlay are closed by the user.".

[ctopCanada]

by mistake

[duboisp]

Seems good from code wise. However it was reported that there were a focus indicator issue when the dialog is closed. Probably this is caused by the overlay plugin and not the bubble/doaction plugin. We should investigate more before to merge this PR. At least submit a PR that will fix the overlay plugin. Probably the issue is here we use a "button" instead of an "anchor". A button should be used.

I will test it more later.