File Upload

1import { FileUpload, FileUploadTrigger, FileUploadDropzone, FileUploadDropzoneIcon } from "@/components/ui/file-upload";
2
3<FileUpload />

1"use client";
2
3import { ark } from "@ark-ui/react/factory";
4import {
5  FileUpload as ArkFileUpload,
6  useFileUploadContext as useArkFileUploadContext,
7} from "@ark-ui/react/file-upload";
8import { UploadIcon, XIcon } from "lucide-react";
9import type React from "react";
10import { cn } from "@/lib/utils";
11import { Button } from "@/registry/react/components/button";
12
13export const useFileUpload = useArkFileUploadContext;
14
15export const FileUpload = (
16  props: React.ComponentProps<typeof ArkFileUpload.Root>
17) => {
18  const { className, children, ...rest } = props;
19
20  return (
21    <ArkFileUpload.Root
22      className={cn(
23        "group/file-upload",
24        "relative",
25        "flex flex-col justify-center gap-4",
26        className
27      )}
28      data-slot="file-upload"