Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Shared Link File Upload Block for Radix UI

A create band for a recipient, a lifetime (1 hour to 30 days), a download switch and an optional password, and a list of one link per recipient with a real Copy button and a Revoke that turns off only that link.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Give every recipient their own link, with this file upload panel for React with Radix UI. It is the sharing screen of Wickerlink, a file-sharing service, for one file, brand-guide.pdf. A new-link band takes a recipient in an Input, a lifetime in a Select (1 hour, 1 day, 7 days or 30 days), an Allow download Switch and an optional password in a Password Input; Create link adds a row at the top of the list with a sample link, its end date, whether it can download, whether a password guards it and a download count. Each row has a real Copy Button and a Revoke that asks in an Alert Dialog, with Cancel focused, and then turns off that link only. A recipient is required, and the list holds six links. The panel is ruled by Guides. It is built from Input, Select, Switch, Password Input, Copy Button, Alert Dialog, Shine Button and Guides, with a CSS entrance only. For file sharing, client reviews and any screen where each recipient needs a link of their own.

FAQ

Why one link for each recipient?

A shared link cannot be taken back from one person without breaking it for everyone. With a link per recipient, Revoke turns off the one you pick and the rest keep working, and the download count tells you who opened the file.

What happens to the password I type?

It is used only to mark the new row "Password set" and is cleared when the link is created. The block never shows it again, stores it or sends it. In a real app you would hash it on the server and ask for it before the file opens.

What does Revoke do?

It opens an alert dialog with Cancel focused. Confirming marks only that row Off and disables its Copy and Revoke; the other links are untouched and the status line says so. Cancelling returns focus to the row's Revoke button.

Where do the end dates come from?

From one fixed "as of" moment, 18 October 2026 at 09:00 UTC, plus the lifetime you pick. Nothing reads the clock, so the page looks the same on every load.

Is the Copy button real?

Yes. It copies the sample link to your clipboard and says so in the status line. The link points at a made-up address on an example domain and opens nothing.

What stays local, and how do I wire it?

Everything: links, rows, counts and the revoke state live in this page and nothing is created, shared or sent. To wire it, create the link on your server when the form is submitted (a random code, the lifetime, the download flag and a password hash), return it, and make Revoke delete or flag that one record.