Layout
Download Card
Storybook
Download Card
Storybook
It is a download card that allows the user to download a file.
Import
1import { DownloadCard } from 'dd360-ds'1import DownloadCard from 'dd360-ds/DownloadCard'Usage
The following 3 props are required to use the component:
- cancelText: Text to be displayed in the cancel button.
- downloadText: Text displayed on the download button.
- description: Description of the content to be downloaded.
1import { DownloadCard } from 'dd360-ds'
2
3<DownloadCard
4 cancelText='Do not remind me again'
5 downloadText='Download Template'
6 description='Download the excel template, fill in the necessary fields and re-upload the file to populate the table. You can also fill the table manually.'
7/>DownloadURL
URL of the file to download.
1import { DownloadCard } from 'dd360-ds'
2
3<DownloadCard
4 cancelText='Do not remind me again'
5 downloadText='Download Template'
6 description='Download the excel template, fill in the necessary fields and re-upload the file to populate the table. You can also fill the table manually.'
7 downloadURL='URL'
8/>isActive
If true, the card is shown; if false, the card is hidden. Default is true
1import { DownloadCard } from 'dd360-ds'
2
3<DownloadCard
4 cancelText='Do not remind me again'
5 downloadText='Download Template'
6 description='Download the excel template, fill in the necessary fields and re-upload the file to populate the table. You can also fill the table manually.'
7 isActive={false}
8/>API Reference
| Name | Types | Default |
|---|---|---|
| "cancelText"* | string | - |
| "downloadText"* | string | - |
| "description"* | string | - |
| "onClose" | function | - |
| "onDownload" | function | - |
| "downloadURL" | string | - |
| "LinkComponent" | ReactNode | - |
| "isActive" | boolean | true |
| "width" | number | - |