@payfit/unity-components
Version:
52 lines (51 loc) • 2.95 kB
TypeScript
import { ReactElement, ReactNode } from 'react';
import { DropZoneProps as AriaDropZoneProps, FileTriggerProps as AriaFileTriggerProps } from 'react-aria-components';
import { DropzoneProps } from '../dropzone/Dropzone.js';
export interface FileUploadDropzoneProps extends Omit<DropzoneProps, 'children' | 'onDrop'>, Pick<AriaFileTriggerProps, 'acceptDirectory' | 'acceptedFileTypes' | 'allowsMultiple' | 'defaultCamera' | 'onSelect'> {
/** Names the native picker input for browser form semantics. */
name?: string;
/** The visual dropzone content. */
children: ReactNode;
/** Receives the accepted file drop event. */
onDrop?: AriaDropZoneProps['onDrop'];
/**
* Replaces the default `FileUploadDropzoneButton` picker action.
*
* The supplied element must accept `isDisabled` so FileUploadDropzone can
* keep its picker unavailable while `state="disabled"`.
*/
picker?: ReactElement<{
isDisabled?: boolean;
}>;
/** Whether the whole dropzone or only `picker` opens the file selector. */
pickerMode?: 'surface' | 'button';
}
/**
* Gives file workflows one destination for dropping files and choosing them.
*
* FileUploadDropzone combines Dropzone with FileUploadTrigger without owning
* selected files, validation, or upload transport. Use `pickerMode="surface"`
* when the whole target should open the picker; use the default `button` mode
* when people should choose files through a separate action.
* @param props - Dropzone content, file-selection options, and picker mode.
* @param props.children - The visual cue, label, and description for the target.
* @param props.acceptDirectory - Lets the native picker select a directory.
* @param props.acceptedFileTypes - Restricts files shown by the native picker.
* @param props.allowsMultiple - Lets the native picker select several files.
* @param props.defaultCamera - Selects the preferred device camera on supported devices.
* @param props.name - Names the native picker input for form submission.
* @param props.picker - Replaces the compact primary FileUploadDropzoneButton.
* @param props.pickerMode - Makes the full surface or only `picker` pressable.
* @param props.onSelect - Receives files selected through the native picker.
* @param props.onDrop - Receives files dropped on the target.
* @see {@link FileUploadDropzoneProps} for all supported file and drop options.
* @remarks
* The default picker receives the disabled state automatically. Custom
* `picker` elements also receive `isDisabled`; provide an alternative
* file-selection action whenever dragging is not available.
*/
declare const FileUploadDropzone: {
({ pickerMode, picker, children, acceptDirectory, acceptedFileTypes, allowsMultiple, defaultCamera, name, onSelect, ...dropzoneProps }: FileUploadDropzoneProps): import('react/jsx-runtime').JSX.Element;
displayName: string;
};
export { FileUploadDropzone };