fix: ensure proper readonly arrays for types

typings/react-dropzone.d.ts

@@ -24,7 +24,7 @@ export interface FileError {
 
 export interface FileRejection {
   file: File;
-  errors: FileError[];
+  errors: readonly FileError[];
 }
 
 export type DropzoneOptions = Pick<React.HTMLProps<HTMLElement>, PropTypes> & {
@@ -39,19 +39,27 @@ export type DropzoneOptions = Pick<React.HTMLProps<HTMLElement>, PropTypes> & {
   noDragEventsBubbling?: boolean;
   disabled?: boolean;
   onDrop?: <T extends File>(
-    acceptedFiles: T[],
-    fileRejections: FileRejection[],
+    acceptedFiles: readonly T[],
+    fileRejections: readonly FileRejection[],
+    event: DropEvent
+  ) => void;
+  onDropAccepted?: <T extends File>(
+    files: readonly T[],
+    event: DropEvent
+  ) => void;
+  onDropRejected?: (
+    fileRejections: readonly FileRejection[],
     event: DropEvent
   ) => void;
-  onDropAccepted?: <T extends File>(files: T[], event: DropEvent) => void;
-  onDropRejected?: (fileRejections: FileRejection[], event: DropEvent) => void;
   getFilesFromEvent?: (
     event: DropEvent
   ) => Promise<Array<File | DataTransferItem>>;
   onFileDialogCancel?: () => void;
   onFileDialogOpen?: () => void;
   onError?: (err: Error) => void;
-  validator?: <T extends File>(file: T) => FileError | FileError[] | null;
+  validator?: <T extends File>(
+    file: T
+  ) => FileError | readonly FileError[] | null;
   useFsAccessApi?: boolean;
   autoFocus?: boolean;
 };
@@ -68,8 +76,8 @@ export type DropzoneState = DropzoneRef & {
   isDragAccept: boolean;
   isDragReject: boolean;
   isFileDialogActive: boolean;
-  acceptedFiles: File[];
-  fileRejections: FileRejection[];
+  acceptedFiles: readonly File[];
+  fileRejections: readonly FileRejection[];
   rootRef: React.RefObject<HTMLElement>;
   inputRef: React.RefObject<HTMLInputElement>;
   getRootProps: <T extends DropzoneRootProps>(props?: T) => T;
@@ -93,5 +101,5 @@ export interface DropzoneInputProps
 type PropTypes = "multiple" | "onDragEnter" | "onDragOver" | "onDragLeave";
 
 export interface Accept {
-  [key: string]: string[];
+  [key: string]: readonly string[];
 }

typings/tests/basic.tsx

@@ -5,7 +5,7 @@ import { FileWithPath } from "file-selector";
 export default class Basic extends React.Component {
   state = { files: [] };
 
-  onDrop = (files: FileWithPath[]) => {
+  onDrop = (files: readonly FileWithPath[]) => {
     this.setState({
       files,
     });

typings/tests/readonly-accept.tsx

@@ -0,0 +1,28 @@
+import React from "react";
+import Dropzone from "../../";
+
+const ACCEPT = {
+  "image/*": [".jpeg", ".png"],
+} as const;
+
+export default class Basic extends React.Component {
+  render() {
+    return (
+      <section>
+        <div className="dropzone">
+          <Dropzone accept={ACCEPT}>
+            {({ getRootProps, getInputProps }) => (
+              <div {...getRootProps()}>
+                <input {...getInputProps()} />
+                <p>
+                  Try dropping some files here, or click to select files to
+                  upload.
+                </p>
+              </div>
+            )}
+          </Dropzone>
+        </div>
+      </section>
+    );
+  }
+}