Button for downloading a file

[synnottd]

If pressing the trigger results in a URL change, or that resultant page makes sense as a whole new browser tab use an Anchor element. Everything else is a Button.
https://paste.twilio.design/components/button/#button-vs-anchor-link

This leads me to believe it is correct to use a button for a file download, or am I missing something?

If that is correct should it be possible to create a button like this?

<Button
    as="a"
    variant="link"
    href={downloadHref}
    download={filename}
>
    Download file
</Button>

At the moment download is not a valid prop.

[richbachman]

Hi @synnottd

Thanks for posting this question.

Based off the information provided, the Anchor component would suit your use-case better. Even though it feels like you're performing an action by downloading, you're actually navigating to the file to be dowloaded. Therefore the Anchor component which comes with the download prop is the most appropriate or this scenario.

The question then becomes, does the Anchor component provide enough visual prominence? Do you have any visuals (screenshots or CodeSandbox) so we could help evaluate that further?

[pguptaDS]

Just read the thread. @synnottd I am ok with using an anchor here instead if that's the correct component to use. Thanks Rich for the guidance!