Renders an card for wrapping form fields. May be used to recreate the look of an Backpex edit view.

Examples

<.form :let={f} for={@form} phx-change="validate" phx-submit="submit">
  <.edit_card>
    <:panel label="Names">
      <.input field={f[:first_name]} type="text" />
      <.input field={f[:last_name]} type="text" />
    </:panel>

    <:actions>
      <button>Save</button>
    </:action>
  </.edit_card>
</.form>

Slots

• panel - a panel section. Accepts attributes:
  • class (:string) - optional class to be added to the wrapping panel element.
  • label (:string) - optional label to be displayed as a headline for the panel.
• actions - actions like a save or cancel button.

Renders an info block to indicate that no items are found.

Attributes

• socket (:any) (required)
• live_resource (:atom) (required) - live resource module.
• params (:map) (required) - query params.
• singular_name (:string) (required) - singular name of the resource.

Renders an active filter badge with its value and a clear button.

This component displays applied filters as visual badges that show both the filter label and its current value. Each badge includes a clear button (×) that allows users to remove individual filters.

Examples

<.filter_badge
  filter_name="status"
  label="Status"
  live_resource={MyApp.UserLive}
>
  Active
</.filter_badge>

Attributes

• live_resource (:any) - live resource module. Defaults to nil.
• clear_event (:string) - event triggered when the clear button is clicked. Defaults to "clear-filter".
• filter_name (:string) (required) - unique identifier for the filter being displayed.
• label (:string) (required) - human-readable filter name displayed on the badge.

Slots

• inner_block (required) - rendered filter value content (typically from filter module's render/1 function).

Renders a dropdown button that typically contains filter forms for the resource index.

It provides the main filter interface with a button that shows a funnel icon and a "Filters" label. When clicked, it opens a dropdown containing all available filter forms. The button displays a badge with the count of active filters when any filters are applied.

Examples

<.filter_dropdown filter_count={@filter_count}>
  <.form :let={f} for={@form} phx-change="change-filter" class="space-y-5">
    <.filter_form_field filter_name={:status} label="Status" show_clear_button={@filter_opts[:status]}>
      <.input type="select" prompt="Select status..." options={@status_options} />
    </.filter_form_field>
  </.form>
</.filter_dropdown>

Attributes

• live_resource (:any) - live resource module. Defaults to nil.
• filter_count (:integer) - number of currently active filters (shows as badge when > 0).

Slots

• inner_block (required) - filter forms content.

Renders a filter field container with label, form inputs, and optional clear button. Providing a structured layout for individual filter controls within the filter menu.

Typically used within .filter_forms/1 to render each individual filter in the filter dropdown. The form inputs are provided via the inner_block slot, while preset buttons are provided via the presets slot.

Examples

<.filter_form_field
  filter_name={:status}
  label="Status"
  show_clear_button={@has_status_filter}
>
  <.input type="select" field={@form[:status]} options={@status_options} />
  <:presets>
    <.filter_presets presets={[{"Active", "active"}, {"Inactive", "inactive"}]} />
  </:presets>
</.filter_form_field>

Attributes

• live_resource (:any) - live resource module. Defaults to nil.
• clear_event (:string) - event name triggered when clearing the filter. Defaults to "clear-filter".
• filter_name (:string) (required) - unique identifier for the filter field.
• label (:string) (required) - human-readable label displayed above the filter.
• show_clear_button (:boolean) (required) - whether to show the clear button (typically when filter has a value).

Slots

• inner_block (required) - filter form inputs (selects, text inputs, etc.).
• presets - optional preset buttons for common filter values.

Renders form with a search field. Emits the simple-search-input event on change.

Attributes

• searchable_fields (:list) - The fields that can be searched. Here only used to hide the component when empty. Defaults to [].
• full_text_search (:string) - full text search column name. Defaults to nil.
• value (:string) (required) - value binding for the search input.
• placeholder (:string) (required) - placeholder for the search input.

Renders a link to change the order direction for a given column.

Attributes

• socket (:map) (required)
• live_resource (:any) (required) - module of the live resource.
• params (:string) (required) - query parameters.
• query_options (:map) (required) - query options.
• label (:string) (required) - label to be displayed on the link.
• name (:atom) (required) - name of the column the link should change order for.

Renders pagination buttons. You are required to provide a :page pattern in the URL. It will be replaced with the corresponding page number.

Attributes

• current_page (:integer) (required) - current page number.
• total_pages (:integer) (required) - number of total pages.
• path (:string) (required) - path to be used for page links.
• next_page_label (:string) - Defaults to "Next page".
• previous_page_label (:string) - Defaults to "Previous page".

Renders pagination info about the current page.

Attributes

• total (:integer) (required) - total number of items.
• query_options (:map) (required) - query options.
• live_resource (:atom) - the live resource module. Defaults to nil.

Renders a button group with create and resource action buttons.

Attributes

• socket (:any) (required)
• live_resource (:any) (required) - module of the live resource.
• params (:string) (required) - query parameters.
• query_options (:map) - query options. Defaults to %{}.
• resource_actions (:list) - list of all resource actions provided by the resource configuration. Defaults to [].
• singular_name (:string) (required) - singular name of the resource.

Renders the field of the given resource.

Attributes

• name (:string) (required) - name / key of the item field.
• item (:map) (required) - the item which provides the value to be rendered.
• fields (:list) (required) - list of all fields provided by the resource configuration.

Renders the input fields for filters and search.

Attributes

• live_resource (:any) (required) - module of the live resource.
• searchable_fields (:list) - The fields that can be searched. Here only used to hide the component when empty. Defaults to [].
• query_options (:map) - query options. Defaults to %{}.
• search_placeholder (:string) (required) - placeholder for the search input.

Renders a resource form field.

Attributes

• name (:string) (required) - name / key of the item field.
• form (:map) (required) - form that will be used by the form field.
• repo (:any) - ecto repo.
• uploads (:map) - map that contains upload information. Defaults to %{}.
• fields (:list) (required) - list of all fields provided by the resource configuration.

Renders the main resource index content.

Attributes

• socket (:any) (required)
• live_resource (:any) (required) - module of the live resource.
• params (:string) (required) - query parameters.
• query_options (:map) - query options. Defaults to %{}.
• total_pages (:integer) - amount of total pages. Defaults to 1.
• resource_actions (:list) - list of all resource actions provided by the resource configuration. Defaults to [].
• singular_name (:string) (required) - singular name of the resource.
• orderable_fields (:list) - list of orderable fields. Defaults to [].
• items (:list) - items that will be displayed in the table. Defaults to [].
• fields (:list) - list of fields to be displayed in the table on index view. Defaults to [].

Renders a resource table.

Attributes

• socket (:any) (required)
• live_resource (:any) (required) - module of the live resource.
• params (:string) (required) - query parameters.
• query_options (:map) - query options. Defaults to %{}.
• fields (:list) (required) - list of fields to be displayed in the table on index view.
• orderable_fields (:list) - list of orderable fields. Defaults to [].
• searchable_fields (:list) - list of searchable fields. Defaults to [].
• items (:list) - items that will be displayed in the table. Defaults to [].
• active_fields (:list) (required) - list of active fields.
• selected_items (:list) (required) - list of selected items.

Renders the metrics area for the current resource.

Attributes

• metrics (:list) - list of metrics to be displayed. Defaults to [].

Renders a show card.

Attributes

• socket (:any) (required)
• live_resource (:any) (required) - module of the live resource.
• params (:string) (required) - query parameters.
• item (:map) (required) - item that will be rendered on the card.
• fields (:list) (required) - list of fields to be displayed on the card.

Renders a select per page button.

Attributes

• options (:list) (required) - A list of per page options.
• query_options (:map) - The query options. Defaults to %{}.
• class (:string) - Extra class to be added to the select. Defaults to "".

Renders a show panel.

Attributes

• panel_fields (:list) (required) - list of fields to be rendered in the panel.
• class (:string) - extra class to be added. Defaults to "".
• label (:any) - optional label for the panel. Defaults to nil.

Renders the toggle columns dropdown.

Attributes

• socket (:any) (required)
• active_fields (:list) (required) - list of active fields.
• live_resource (:atom) (required) - the live resource.
• current_url (:string) (required) - the current url.
• class (:string) - additional class to be added to the component. Defaults to "".

Renders the toggle columns inputs.

Attributes

• form (:any) (required) - the form.
• active_fields (:list) (required) - list of active fields to be displayed.