Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Flowbite button does not have attribute download #1387

Closed
2 tasks done
Hann1bal opened this issue May 5, 2024 · 5 comments
Closed
2 tasks done

Flowbite button does not have attribute download #1387

Hann1bal opened this issue May 5, 2024 · 5 comments

Comments

@Hann1bal
Copy link

Hann1bal commented May 5, 2024

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Steps to reproduce

Current behavior

<Button href={'data:text/json;charset=utf-8,${encodeURIComponent(JSON.stringify(tasss))}'} color="gray" className="w-full mb-2" download={"filename.json"}>
 Download Json
 </Button>

I write button for downloading buffered data and it's working but i can't compile. I got the error:

Type '{ children: string; href: string; color: string; className: string; download: string; }' is not assignable to type 'IntrinsicAttributes & { href?: string; color?: keyof FlowbiteColors; fullSized?: boolean; gradientDuoTone?: keyof ButtonGradientDuoToneColors; ... 10 more ...; theme?: { ...; }; } & AsProp<...> & { ...; } & Omit<...> & { ...; }'.
  Property 'download' does not exist on type 'IntrinsicAttributes & { href?: string; color?: keyof FlowbiteColors; fullSized?: boolean; gradientDuoTone?: keyof ButtonGradientDuoToneColors; ... 10 more ...; theme?: { ...; }; } & AsProp<...> & { ...; } & Omit<...> & { ...; }'. Did you mean 'onLoad'?ts(2322)

Expected behavior

In default html button exist "download" attribute
.

@dhavalveera
Copy link
Contributor

Hey @Hann1bal

I just checked with default HTML Button with download attribute which didn't worked for me..

Here is an Example which have the download attribute but when you click on button, it's not working at all.

the download attribute works on anchor tag, not on button.

@Hann1bal
Copy link
Author

Hey @Hann1bal

I just checked with default HTML Button with download attribute which didn't worked for me..

Here is an Example which have the download attribute but when you click on button, it's not working at all.

the download attribute works on anchor tag, not on button.

Do u use the blob or something else? In few hour I can share example.

@SutuSebastian
Copy link
Collaborator

This can be easily solved by casting the Button component as "a" or as Link component if using a framework such as Next.js.

Before:
Screenshot 2024-05-28 at 12 57 08

After

as="a"
Screenshot 2024-05-28 at 12 57 13

as={Link}
Screenshot 2024-05-28 at 12 57 58

@SutuSebastian
Copy link
Collaborator

Button itself does not have download attribute by nature, just like @dhavalveera mentioned earlier.

@Hann1bal
Copy link
Author

Button itself does not have download attribute by nature, just like @dhavalveera mentioned earlier.

Thank you. It's work.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants