Skip to main content

FileDropZone

Function FileDropZone 

Source
pub fn FileDropZone(_: FileDropZoneProps) -> Element
Expand description

A zone that accepts files dragged in from the operating system or chosen from the native file picker opened by clicking the zone.

Independent of DndContext - native files don’t come from inside your app, so no provider is required.

While a drag hovers the zone the div carries data-over="true" (absent otherwise), so the classic “highlight the dropzone” style needs no on_hover wiring: Tailwind data-over:border-blue-500, CSS [data-over].

§Props

For details, see the props struct definition.

  • filter : Option<FileFilter>

    Acceptance rules; everything is accepted when omitted.

  • on_files : EventHandler<FileDrop>

    Fired with accepted dropped or selected files (if at least one passed).

  • on_rejected : Option<EventHandler<Vec<(FileData,FileRejection)>>>

    Fired with rejected dropped or selected files, if any.

  • on_hover : Option<EventHandler<bool>>

    Fired with true when a drag hovers the zone, false when it leaves.

  • multiple : bool

    Allow selecting more than one file in the native picker.

  • disabled : bool

    Disable picker activation and native file input.

  • label : String

    Accessible name for the keyboard-focusable drop zone.

  • attributes : Vec<Attribute>
  • children : Element