# `MishkaGervaz.UIAdapters.MediaGallery`
[🔗](https://github.com/mishka-group/mishka_gervaz/blob/v0.0.2/lib/mishka_gervaz/ui_adapters/media_gallery.ex#L1)

UI adapter for the media gallery template.

Extends the Tailwind adapter; only `button/1` differs, because a media card's actions are not a
row of labelled controls — they are the small bordered squares under the file's name, and beside
them one wide button that says what it does.

Both are the SAME button. This draws one square and colours it by `variant`, and the label always
reaches the DOM inside a `.lbl` span; `MishkaGervaz.Table.Templates.MediaGallery` widens the one
it makes primary and hides the label on the rest. Drawing two shapes here instead would put the
card's layout in two places, and the template is the one that knows how much room there is.

Everything else — including the view switcher — falls back to `MishkaGervaz.UIAdapters.Tailwind`.

Reached through `MishkaGervaz.Table.Templates.MediaGallery.render_item/1`, which swaps to this
adapter whenever the resource has not named one of its own, so a card carries the same buttons on
every surface that borrows it — the Media library and the page builder's Assets sheet alike.

# `alert`

# `archive_toggle`

# `array_fields`

# `badge`

# `bulk_action_bar`

# `bulk_action_button`

# `button`

A card action, drawn as a bordered square around a 15px glyph, dimmed while its click is pending
(`phx-click-loading:`, see `MishkaGervaz.UIAdapters.Tailwind`).

A `:destroy` variant is tinted red — an archive or a permanent delete should not look like the
three buttons next to it. An action that declares its own `ui do class … end` keeps it; that is
the escape hatch for a design this square does not fit.

## Attributes

* `label` (`:string`) - Defaults to `nil`.
* `class` (`:string`) - Defaults to `nil`.
* `icon` (`:string`) - Defaults to `nil`.
* `variant` (`:atom`) - Defaults to `:default`.
* Global attributes are accepted. Supports all globals plus: `["phx-click", "phx-target", "phx-value-id", "phx-value-event", "phx-value-values", "data-confirm"]`.

# `cell_array`

# `cell_avatars`

# `cell_bars`

# `cell_code`

# `cell_date`

# `cell_datetime`

# `cell_empty`

# `cell_number`

# `cell_stacked`

# `cell_stats`

# `cell_tags`

# `cell_text`

# `checkbox`

# `combobox`

# `copy_button`

# `date_input`

# `date_range_container`

# `datetime_input`

# `dropdown`

# `empty_state`

# `error_state`

# `field_error`

# `field_group`

# `field_wrapper`

# `filter_reset_button`

# `form_container`

# `form_footer`

# `form_header`

# `icon`

# `json_editor`

# `load_more_select`

# `loading_state`

# `multi_select`

# `nav_link`

# `nested_fields`

# `number_input`

# `pagination_container`

# `pagination_nav_button`

# `pagination_page_button`

# `password_input`

# `range_input`

# `search_select`

# `select`

# `spinner`

# `step_indicator`

# `step_navigation`

# `string_list_input`

# `table`

# `table_header`

# `td`

# `template_switcher`

# `template_switcher_button`

# `text_input`

# `textarea`

# `th`

# `toggle_input`

# `tr`

# `upload_dropzone`

# `upload_existing_file`

# `upload_file_input`

# `upload_preview`

# `upload_progress`

---

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