# `Backpex.HTML.Resource`
[🔗](https://github.com/naymspace/backpex/blob/0.18.3/lib/backpex/html/resource.ex#L1)

Contains all Backpex resource components.

# `edit_card`

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.

# `empty_state`

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.

# `filter_badge`

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).

# `filter_dropdown`

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.

# `filter_form_field`

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.

# `index_search_form`

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.

# `inlined_resource_field`

Renders an inlined field.

## Attributes

* `id` (`:string`) (required)
* `hide_label` (`:boolean`) - whether to hide the label (left column). Defaults to `false`.
* `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.

# `order_link`

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.

# `pagination`

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"`.

# `pagination_info`

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`.

# `resource_buttons`

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.

# `resource_field`

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.

# `resource_filters`

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.

# `resource_form_field`

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.
* `hide_label` (`:boolean`) - whether to hide the label (left column). Defaults to `false`.
* `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.

# `resource_index_main`

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 `[]`.

# `resource_index_table`

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.

# `resource_metrics`

Renders the metrics area for the current resource.

## Attributes

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

# `resource_show_main`

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.

# `select_per_page`

Renders a select per page button.

## Attributes

* `live_resource` (`:atom`) - The LiveResource module. Defaults to `nil`.
* `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 `""`.

# `show_panel`

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`.

# `toggle_columns`

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 `""`.

# `toggle_columns_inputs`

Renders the toggle columns inputs.

## Attributes

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

# `action_visible?`

Checks if an action should be visible for the given type.

# `filter_item_actions`

Filters item actions based on visibility type.

# `form_component`

# `lv_reserved_assigns`

Returns the list of assigns that `Phoenix.LiveView` reserves and that must be dropped
before spreading parent assigns into a child `Phoenix.LiveComponent`.

`Phoenix.Component.assign/3` rejects these keys with an `ArgumentError`. Centralizing
the list here ensures every spread site forwards the same safe subset of the parent's
assigns.

# `pagination_items`

Creates a list of pagination items based on the current page and the total number of pages. A maximum of five pages will be displayed.

### Example

    iex> Backpex.HTML.Resource.pagination_items(1, 1)
    [%{type: :number, number: 1}]

    iex> Backpex.HTML.Resource.pagination_items(1, 2)
    [%{type: :number, number: 1}, %{type: :number, number: 2}, %{type: :next, number: nil}]

    iex> Backpex.HTML.Resource.pagination_items(2, 2)
    [%{type: :prev, number: nil}, %{type: :number, number: 1}, %{type: :number, number: 2}]

    iex> Backpex.HTML.Resource.pagination_items(2, 8)
    [%{type: :prev, number: nil}, %{type: :number, number: 1}, %{type: :number, number: 2}, %{type: :number, number: 3}, %{type: :number, number: 4}, %{type: :placeholder, number: nil}, %{type: :number, number: 8}, %{type: :next, number: nil}]

    iex> Backpex.HTML.Resource.pagination_items(5, 10)
    [%{type: :prev, number: nil}, %{type: :number, number: 1}, %{type: :placeholder, number: nil}, %{type: :number, number: 4}, %{type: :number, number: 5}, %{type: :number, number: 6}, %{type: :placeholder, number: nil}, %{type: :number, number: 10}, %{type: :next, number: nil}]

    iex> Backpex.HTML.Resource.pagination_items(9, 10)
    [%{type: :prev, number: nil}, %{type: :number, number: 1}, %{type: :placeholder, number: nil}, %{type: :number, number: 7}, %{type: :number, number: 8}, %{type: :number, number: 9}, %{type: :number, number: 10}, %{type: :next, number: nil}]

# `resource_form`

# `resource_form_main`

# `resource_index`

# `resource_show`

---

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