Share Dialog

A dialog that mints a shareable download or upload link with expiry presets clamped to the adapter's signed URL cap - driven by useFiles.

Mints a shareable link for one key. Download links go through url() — a signed URL where the adapter supports it, a permanent public one where it doesn’t — while upload links go through signedUploadUrl(). Pick an expiry (clamped to the adapter’s cap), choose attachment (the default) or inline, then copy. Inline download links require the gateway’s authorize hook to return { disposition: "inline" }.

"use client";

import { demoFiles } from "@/lib/demo-files";
import { ShareDialog } from "@/registry/files-sdk/share-dialog/share-dialog";

const Example = () => {
  const files = demoFiles;

  return <ShareDialog files={files} fileKey="photos/sunset.jpg" />;
};

export default Example;

Installation

npx shadcn@latest add https://files-sdk.dev/r/share-dialog.json

Usage

import { useFiles } from "files-sdk/react";

import { ShareDialog } from "@/components/files-sdk/share-dialog";

export function Row({ fileKey }: { fileKey: string }) {
  const files = useFiles({ endpoint: "/api/files" });

  return <ShareDialog files={files} fileKey={fileKey} />;
}

The component reads capabilities() when it opens, so the expiry presets are clamped to the adapter’s signedUrl.maxExpiresIn and it warns when the backend can only return a permanent public URL. Pass mode="upload" to hand out a presigned upload target instead — the dialog shows its method and any headers or form fields the target requires (a POST form, or Azure’s x-ms-blob-type header), and copies the whole target as JSON when the URL alone isn’t enough. Pass custom trigger content via children (rendered inside the trigger button, which you can style through className).

Props