# `PhoenixKitProjects.Web.Components.AssigneeFilterPanel`
[🔗](https://github.com/BeamLabEU/phoenix_kit_projects/blob/v0.21.2/lib/phoenix_kit_projects/web/components/assignee_filter_panel.ex#L1)

`<.assignee_filter_panel>` — the Filters funnel button (badged with the
active-filter count) plus its client-side popup panel: person typeahead,
Me/Unassigned quick-adders, active chips, Personal-only and Overdue-only
refinements, and Clear.

Pure UI over `Web.AssigneeFilter`'s assigns/events: the events land on the
parent LiveView, which forwards them through `AssigneeFilter.update/3` (see
that module's usage note). The panel opens/closes entirely client-side —
`JS.toggle` on the button (LV JS commands stick across patches, so toggling
a control inside doesn't collapse it) with `phx-click-away` on the shared
wrapper for outside-click dismiss. Pass a unique `id` per page so two
panels (e.g. the Overview and an embedded project calendar) can't collide.

# `assignee_filter_panel`

## Attributes

* `id` (`:string`) (required) - unique prefix for the panel/picker DOM ids.
* `picker_target` (`:string`) - CSS selector of a PARENT-LV-owned element the person picker's events
  should route to. Required when the panel renders INSIDE another
  LiveComponent's DOM (e.g. the calendar's toolbar slot): the SearchPicker
  hook auto-targets its enclosing component, which would swallow the
  search/pick events. Plain phx-click events are unaffected — they always
  reach the LV.

  Defaults to `nil`.
* `assignee_selected` (`:list`) (required)
* `include_unassigned?` (`:boolean`) (required)
* `unassigned_count` (`:integer`) (required)
* `assignee_direct_only?` (`:boolean`) (required)
* `overdue_only?` (`:boolean`) (required)
* `overdue_count` (`:integer`) (required)
* `me_scope` (`:any`) (required)

---

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