jamsrui_file_upload_component_quickstart_with_multiple_files.ts

1"use client";
2
3import React from "react";
4import { FileUpload, type FileUploadProps } from "@jamsrui/file-upload";
5
6const QuickStartFileUpload = () => {
7  const [files, setFiles] = React.useState<File[]>([]);
8
9  const handleChange: FileUploadProps["onChange"] = (selectedFiles) => {
10    setFiles(selectedFiles);
11    console.log("Selected files:", selectedFiles);
12  };
13
14  return (
15    <div className="p-4">
16      <FileUpload
17        label="Upload Files"
18        description="Select or drag and drop files here"
19        onChange={handleChange}
20        multiple
21        accept="image/*"
22      />
23      
24      {files.length > 0 && (
25        <div className="mt-4">
26          <p className="text-sm font-medium">Selected files: {files.length}</p>
27        </div>
28      )}
29    </div>
30  );
31};
32
33export default QuickStartFileUpload;