Is there a disabled state for an anchor?

[mjanssen2021]

I'm designing an updated flow for the Authy app and we use the anchor to lead to a full page modal that explains twilios data privacy in simple context for the end user. We have a loading state for this screen - but I noticed we didn't have a disabled state for the anchor in any PASTE documentation or figma libraries.

Do we really not have a disabled state for an anchor?

[nkrantz]

Hey, @mjanssen2021!

Updating my previous answer with a bit more context:

We don't have a disabled state for the Anchor component, but in general we recommend using Buttons to launch Modals. The distinction between Buttons and Anchors informs your customers (especially those who are using assistive technology) of what they can expect to happen when they interact with the component. Anchors should open pages, while Buttons should perform actions.

URLs don't have a disabled state in Paste because it's not a supported interaction in general (there's no disabled state for the HTML a tag). There are hack-y ways to get around disabling an anchor, but it can be confusing for users.

On the other hand, Buttons can be disabled. We have a Link-Style Button that looks like a Link, but still communicates to assistive technology users that clicking on it will not take them to a new page. This would probably be your best bet for this use case.

Thanks!