shared-components icon indicating copy to clipboard operation
shared-components copied to clipboard

Support disabled state in anchor without using disabled attribute

Open zacklitzsinger opened this issue 7 years ago • 4 comments

The disabled HTML attribute is only supported for certain HTML tags, not including <a>. We should make sure that the disabled attribute doesn't end up on the anchor since it creates bad expectations. Instead, we should mark disabled state via a class.

zacklitzsinger avatar Dec 19 '18 16:12 zacklitzsinger

I think we could just omit sending disabled to the underlying HTML element. Using a disabled prop still makes sense for the Link component contract since passing disabled will also disconnect the click event handlers and navigation, not just change the styling.

I don't have a problem with supporting an extended featureset beyond the native link, and disabled is an intuitive name imo.

a-type avatar Jan 02 '19 16:01 a-type

+1. We should keep the disabled prop on the <Link> component and just turn it into a classname on the underlying anchor.

zacklitzsinger avatar Jan 02 '19 18:01 zacklitzsinger

With styled-components I'm not sure a classname is necessary, since we can just pass it in as a prop to do conditional styling (styled-components internally will generate a new classname variant for this).

a-type avatar Jan 07 '19 16:01 a-type

We don't need a classname for styling, we need it to be able to assert state on when an anchor is disabled when testing.

zacklitzsinger avatar Jan 07 '19 16:01 zacklitzsinger