"Clickable Action" - A Component to Showcase a Clickable Action

[andrewballantyne]

Is this a new component or an extension of an existing one?

This would be a new component.

We styled it off of the Editable Label Group (eg https://www.patternfly.org/v4/components/label-group#editable-labels).

Describe the feature

A contextual clickable action to prompt the user there is more content there. We needed a low footprint way to give a clickable notion to Starting... text for when the resource was spinning up and going through K8s setup. This granted them more options to view how that was going, with and without an blocking error state.

Normal running:

Hidden error -- click for more info, had tooltip for short text on the error description:

The popup with the fully detailed k8s (in this case) error:

Are there visuals for this feature? If applicable, please include examples for each state and for varying widths

We followed the styles of the Editable Label Group. Underline, cursor finger. We added an error icon with tooltip when it was applicable -- not sure if that's needed part of this component, it could just be the content.

Any other information?

Working with the UX team on RHODS we came up with this action so we could bring attention to the user when there was additional contextual information for them to get at if they wanted to. If there was an issue, we combined it with an error icon and tooltip hover to help draw more attention.

[andrewballantyne]

cc @kywalker-rh

[mcarrano]

Transferring for more discussion