FileUploadZone.tsx

Handles file uploads, enables end. → Gated input rendered input.

// Source: https://github.com/erickittelson/slidemason | License: MIT | Copyright 2026 Eric Kittelson
// Provided via justclaw.it.com; keep this notice with the code.
import { useRef, useState, type DragEvent } from 'react';

interface FileUploadZoneProps {
  files: { name: string; ext: string }[];
  onUpload: (files: FileList) => void;
  onRemove: (name: string) => void;
}

export function FileUploadZone({ files, onUpload, onRemove }: FileUploadZoneProps) {
  const inputRef = useRef<HTMLInputElement>(null);
  const [dragging, setDragging] = useState(false);

  const handleDrop = (e: DragEvent) => {
    e.preventDefault();
    setDragging(false);
    if (e.dataTransfer.files.length) onUpload(e.dataTransfer.files);
  };

  const handleDragOver = (e: DragEvent) => { e.preventDefault(); setDr

... (truncated -- full source via MCP)