Drop zone and drag transfer list components for PhiaUI.
drop_zone/1— a styled drop target for files or arbitrary drag payloads, backed by thePhiaDropZonehook.drag_transfer_list/1— a dual-list transfer widget backed byPhiaDragTransferList, with drag-and-drop and button-click fallbacks.
drop_zone example
<.drop_zone id="file-zone" label="Drop files here" on_drop="file_dropped"
state={@zone_state} />drag_transfer_list example
<.drag_transfer_list
id="role-picker"
source_label="Available roles"
target_label="Assigned roles"
source_items={@available}
target_items={@assigned}
on_transfer="roles_updated"
/>Summary
Functions
Renders a dual-list transfer widget with drag-and-drop and button fallbacks.
Renders a dashed-border drop zone target.
Functions
Renders a dual-list transfer widget with drag-and-drop and button fallbacks.
Each item in source_items / target_items must be a map with :id and
:label keys. The hook emits on_transfer with:
%{item_id: "...", direction: "to_target" | "to_source"}.
Attributes
id(:string) (required)source_label(:string) - Defaults to"Available".target_label(:string) - Defaults to"Selected".source_items(:list) (required)target_items(:list) (required)on_transfer(:string) - Defaults to"items_transferred".class(:string) - Defaults tonil.- Global attributes are accepted.
Renders a dashed-border drop zone target.
The hook transitions data-state between idle → hover → active → idle as
the user drags over the zone, and emits on_drop on file release.
State colours:
idle— muted border, muted backgroundhover— primary/60 border, primary/5 backgroundactive— primary border, primary/10 background (animated pulse)error— destructive border and background
Attributes
id(:string) (required)state(:string) - Defaults to"idle". Must be one of"idle","hover","active", or"error".label(:string) - Defaults to"Drop files here".accepts(:string) - Defaults to"*".on_drop(:string) - Defaults to"zone_drop".class(:string) - Defaults tonil.- Global attributes are accepted.
Slots
inner_blockicon