Function DropZone 

pub fn DropZone<T: Clone + PartialEq + 'static>(_: DropZoneProps<T>) -> Element

A region that accepts drags carrying T.

Handles the HTML5 boilerplate for you: preventDefault on dragover, enter/leave depth counting (so child elements don’t cause hover flicker), and acceptance filtering.

Styling hooks: while an acceptable drag is in flight anywhere, the div carries data-active="true" (reveal your drop targets); while that drag hovers this zone it also carries data-over="true" (highlight it). Both are absent otherwise, so presence-based selectors (CSS [data-over], Tailwind data-over:ring-2) work directly. Driven by the shared context, so they light up for pointer, touch and keyboard drags alike.

Opting into edge adds the closest-edge signal for insertion indicators: while an acceptable pointer drag hovers this zone, the div also carries data-edge="top" | "right" | "bottom" | "left" (the zone edge nearest the pointer, live on every move - see edge_of), and the delivered DropOutcome::edge records it at release. Style it with value selectors, e.g. Tailwind data-[edge=top]:shadow-[0_-2px_0_0_currentColor].

Props

For details, see the props struct definition.

• id : Option<ZoneId>

  Stable identity for this zone. Auto-generated if omitted.

• label : Option<String>

  Human label for screen-reader announcements (“Over {label}”).

• accepts : Option<Callback<T,bool>>

  Return false to reject a payload (zone won’t highlight or accept it).

• edge : Option<EdgeSet>

  Track the zone edge nearest the pointer: EdgeSet::Vertical for top/bottom (a vertical stack), EdgeSet::Horizontal for left/right, EdgeSet::All for all four. Renders data-edge while hovered and fills DropOutcome::edge. Off (absent, None) by default.

• on_drop : EventHandler<DropOutcome<T>>

  Fired on a successful drop.

• attributes : Vec<Attribute>
• children : Element