elastic / eui

Elastic UI Framework 🙌

Home Page:https://eui.elastic.co/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[EuiCard] Remove requirement for `title`

formgeist opened this issue · comments

Is your feature request related to a problem? Please describe.

We're currently implementing a progressive form for the registration process when users sign up to Elastic (Cloud). In this flow the design offers a couple of questions that the user should answer. They're essentially radio buttons, but for speed we're not adding a proper form element, but instead relying on the EuiCard for enabling the user to select their answer.

image

image

Describe the solution you'd like

The current component requires EuiCard to have a title which is not what we want to have to show our long-text question or statement. It can currently be done by choosing to use the EuiCheckableCard component instead and then hiding the checkbox or radio button to achieve the behaviour we want.

Describe alternatives you've considered

We've considered using EuiButton instead for the single-click selection, but the problem is style - buttons have centered text and are less useful for long-text labels.

Desired timeline

We're using the work-around as described above, but would like your consideration on whether to change the requirements for EuiCard going forward.

Additional context

I'm working with @bollinic @zinckiwi @alisonelizabeth on this project

Hey @formgeist.

They're essentially radio buttons, but for speed we're not adding a proper form element.

If they are essentially radio buttons, why not just use a version of radio buttons here?

It can currently be done by choosing to use the EuiCheckableCard component instead and then hiding the checkbox or radio button to achieve the behaviour we want.

Is there a reason you could not use the EuiCheckableCard as-is, without removing the radio buttons? Wouldn't that be the natural option here?

At its core, an EuiCard is just an opinionated EuiPanel that simply shows a title and description.

We do not give any specific guidance on what an EuiCard should be used for, or any particular reasoning for requiring a title.

FWIW, I see no reason to object to removing the requirement to have a title. It provides flexibility for usage and really has no downside.

My concern with this particular issue is not around whether or not we make the title required, but rather the accessibility implications of using an EuiCard as a button. But again, setting that aside, on it's own I think this would be a valid change.

We decided to close this issue. Since an EuiCard without a title is basically just an EuiPanel, we think this might be unnecessary. If you still think this is needed, please feel free to re-open and discuss.

@JasonStoltz Apologies for not getting around to responding to your questions and proposal! I think it's alright if we don't change anything for the moment, I think it might anyway be a specific component for the Discovery flow and we're just using the EuiCard to do the majority of the work. We did implement a workaround for now, maybe we'll revisit it once this design has been solidified.