[Tooltip] Mimic React Tooltip functionality to trigger onClick

[alexisnotalexa]

Issue Type

Feature Request

Component or Pattern Affected

web-components/Tooltip

Expected Behavior

In the current project that I'm working on, we have several instances where we trigger the Tooltip to open on click rather than on hover. When the Tooltip is clicked it stays open until the user clicks somewhere on the page again. An example can be seen here: https://momentum.design/components/tooltip/code

Current Behavior

The Tooltip can only be triggered on hover.

Possible Solution

Create a new prop that can be passed in so that users can choose to trigger the Tooltip 'onClick' or 'MouseEnter'.

Context

Screen.Recording.2021-01-27.at.3.49.35.PM.mov

Your Environment

• Library: Web-Components
• Version used: 2.0.16
• Browser Name and version: Chrome 88
• Operating System and version: macOS 10.15.7
• Link to your project: https://sqbu-github.cisco.com/CBABU/flow-control-design