Beacon.LiveAdmin.AdminComponents (Beacon LiveAdmin v0.4.2)

View Source

Provides Admin UI components.

This file contains new components and also overrided Core components.

Summary

Functions

Renders a back navigation link.

Renders flash notices.

Renders a data list.

Renders a rounded white panel that is pinned to the bottom of the screen and scrolls.

Renders a simple form.

Renders a select input with the available sites to select.

Renders a table with generic styling.

Renders pagination to nagivate table results.

Renders a search input text to filter table results.

Renders a select input to sort table results.

Renders a thumbnail image.

Functions

back(assigns)

Renders a back navigation link.

Examples

<.back navigate={~p"/posts"}>Back to posts</.back>

Attributes

  • navigate (:any) (required)

Slots

  • inner_block (required)

flash(assigns)

Renders flash notices.

Examples

<.flash kind={:info} flash={@flash} />
<.flash kind={:info} phx-mounted={show("#flash")}>Welcome Back!</.flash>

Attributes

  • id (:string) - the optional id of flash container. Defaults to "flash".
  • flash (:map) - the map of flash messages to display. Defaults to %{}.
  • title (:string) - Defaults to nil.
  • kind (:atom) - used for styling and flash lookup.Must be one of :info, or :error.
  • Global attributes are accepted. the arbitrary HTML attributes to add to the flash container.

Slots

  • inner_block - the optional inner block that renders the flash message.

flash_group(assigns)

See Beacon.LiveAdmin.CoreComponents.flash_group/1.

header(assigns)

See Beacon.LiveAdmin.CoreComponents.header/1.

hide(selector)

See Beacon.LiveAdmin.CoreComponents.hide/1.

hide(js, selector)

See Beacon.LiveAdmin.CoreComponents.hide/2.

hide_modal(assigns)

See Beacon.LiveAdmin.CoreComponents.hide_modal/1.

list(assigns)

Renders a data list.

Examples

<.list>
  <:item title="Title"><%= @post.title %></:item>
  <:item title="Views"><%= @post.views %></:item>
</.list>

Slots

  • item (required) - Accepts attributes:
    • title (:string) (required)

main_content(assigns)

Renders a rounded white panel that is pinned to the bottom of the screen and scrolls.

Attributes

  • class (:string) - Defaults to "".

Slots

  • inner_block (required)

show(selector)

See Beacon.LiveAdmin.CoreComponents.show/1.

show(js, selector)

See Beacon.LiveAdmin.CoreComponents.show/2.

simple_form(assigns)

Renders a simple form.

Examples

<.simple_form for={@form} phx-change="validate" phx-submit="save">
  <.input field={@form[:email]} label="Email"/>
  <.input field={@form[:username]} label="Username" />
  <:actions>
    <.button>Save</.button>
  </:actions>
</.simple_form>

Attributes

  • for (:any) (required) - the datastructure for the form.
  • as (:any) - the server side parameter to collect all input under. Defaults to nil.
  • Global attributes are accepted. the arbitrary HTML attributes to apply to the form tag. Supports all globals plus: ["autocomplete", "name", "rel", "action", "enctype", "method", "novalidate", "target"].

Slots

  • inner_block (required)
  • actions - the slot for form actions, such as a submit button.

site_selector(assigns)

Renders a select input with the available sites to select.

Examples

<.site_selector selected_site="dev" options={[:dev, :dy]} />

Attributes

  • selected_site (:string) - Defaults to "".
  • options (:list) - Defaults to [].

table(assigns)

Renders a table with generic styling.

Examples

<.table id="users" rows={@users}>
  <:col :let={user} label="id"><%= user.id %></:col>
  <:col :let={user} label="username"><%= user.username %></:col>
</.table>

Attributes

  • id (:string) (required)
  • rows (:list) (required)
  • row_id (:any) - the function for generating the row id. Defaults to nil.
  • row_click (:any) - the function for handling phx-click on each row. Defaults to nil.
  • row_item (:any) - the function for mapping each row before calling the :col and :action slots. Defaults to &Function.identity/1.

Slots

  • col (required) - Accepts attributes:
    • label (:string)
  • action - the slot for showing user actions in the last table column.

table_pagination(assigns)

Renders pagination to nagivate table results.

Attributes

table_search(assigns)

Renders a search input text to filter table results.

Attributes

table_sort(assigns)

Renders a select input to sort table results.

Attributes

thumbnail(assigns)

Renders a thumbnail image.

Attributes

  • source (:string) - Defaults to nil.

translate_errors(errors, field)

See Beacon.LiveAdmin.CoreComponents.translate_errors/2.