Components
Download Button
Button component to trigger native browser downloads from S3.
DownloadButton requests a presigned GET URL and triggers a native browser download.
Preview
Install
Complete UI setup first — stylesheet and toaster. Then add this component:
import { DownloadButton } from "@dimah-s3/ui";Usage
"use client";
import { useDownload } from "@dimah-s3/react";
import { DownloadButton } from "@dimah-s3/ui";
export function AvatarDownloader({ avatarKey }: { avatarKey: string }) {
const download = useDownload({ route: "avatar" });
return (
<DownloadButton
download={download}
objectKey={avatarKey}
variant="outline"
/>
);
}Props
import type { DownloadButtonProps } from "@dimah-s3/ui";Frequently asked questions
Completed (fetch mode) and failed attachments include a dismiss control that calls download.reset(). You can also call reset() yourself.
Yes. useDownload tracks objectKey internally so loading states and status toasts only affect the button matching the active key.
Use the ProgressDownloadButton component paired with useDownload({ route, mode: "fetch" }).