# `PhiaUi.Components.UploadButton`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/inputs/upload_button.ex#L1)

Button-style file picker — triggers the file dialog without a drop zone.

Provides `upload_button/1` — a compact alternative to the full `file_upload/1`
drop-zone when you just need a button to open the file picker. The selected
file(s) appear in an optional compact list below the button.

Useful for:
- Attaching files in a messaging interface
- Importing a CSV or JSON config file
- Adding a single document to a form without the visual overhead of a dropzone

## Requirements

The parent LiveView must configure the upload with `allow_upload/3`:

    def mount(_params, _session, socket) do
      {:ok, allow_upload(socket, :csv, accept: ~w(.csv), max_entries: 1)}
    end

## Basic usage

    <%!-- Simple upload trigger --%>
    <.upload_button upload={@uploads.csv} label="Import CSV" />

    <%!-- With icon and custom variant --%>
    <.upload_button
      upload={@uploads.documents}
      label="Attach files"
      variant="outline"
      on_cancel="cancel_upload"
    />

## Handling cancel

    def handle_event("cancel_upload", %{"ref" => ref}, socket) do
      {:noreply, cancel_upload(socket, :documents, ref)}
    end

# `upload_button`

Renders a button that opens the system file picker when clicked.

No drop zone is shown — only the button and an optional compact list of
selected entries. Use `file_upload/1` when a visual drop zone is needed.

## Examples

    <.upload_button upload={@uploads.import} label="Import CSV" />

    <.upload_button upload={@uploads.docs} label="Attach" variant="outline" size="sm" />

## Attributes

* `upload` (`:any`) (required) - A `Phoenix.LiveView.UploadConfig` struct from `@uploads.field_name`.
* `label` (`:string`) - Button label text. Defaults to `"Upload file"`.
* `variant` (`:string`) - Button visual style. Defaults to `"default"`. Must be one of `"default"`, `"outline"`, `"ghost"`, or `"secondary"`.
* `size` (`:string`) - Button size. Defaults to `"default"`. Must be one of `"sm"`, `"default"`, or `"lg"`.
* `show_list` (`:boolean`) - When true, renders selected entries in a compact list below the button. Defaults to `true`.
* `on_cancel` (`:string`) - LiveView event name fired when the × remove button is clicked on an entry. Defaults to `"cancel_upload"`.
* `class` (`:string`) - Additional CSS classes applied to the outer wrapper. Defaults to `nil`.

---

*Consult [api-reference.md](api-reference.md) for complete listing*