---
url: "https://vueda.dev/v3/reference/api/vue/FilterMenu.md"
title: "FilterMenu"
---

# FilterMenu

## Overview

Toolbar entry point for adding filters. The trigger opens a menu listing the
fields not yet applied (a popover on desktop, a full-screen dialog on mobile,
via [ResponsiveMenu](/v3/reference/api/vue/ResponsiveMenu.md)); picking one drills the menu in place
to that field's [FilterFieldForm](/v3/reference/api/vue/FilterFieldForm.md), with a back affordance
returning to the list. The trigger teleports into a toolbar zone supplied by
the host view.

Theme entry: [FilterMenu](/v3/reference/theming/keys/FilterMenu.md)

## Props

| Name | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| <span id="prop-iconOverride">iconOverride</span> | `Object` |  | `null` | A partial icon registry (`{ [componentName]: { [iconName]: { component, props } } }`) merged with inherited and default icon entries; scopes icon overrides to this component and its descendants. |
| <span id="prop-themeOverride">themeOverride</span> | `Object` |  | `null` | A partial ThemeObject keyed by component name, merged over this component's theme and provided to descendants. |
| <span id="prop-filterables">filterables</span> | `array` |  | `[]` | Filterable field names to offer: non-hidden fields the client can render an editable input for (e.g. `useViewList`'s `filter.validFilterables`). |
| <span id="prop-filterableDetails">filterableDetails</span> | `object` |  | `{}` | Per-field filter configuration, keyed by field name. |
| <span id="prop-query">query</span> | `object` |  | `{}` | Current URL query, forwarded to the drill-in form. |
| <span id="prop-triggerTarget">triggerTarget</span> | `object\|string` |  | `null` | Element (or selector) the trigger teleports into. When falsy, the trigger renders in place. |
| <span id="prop-label">label</span> | `string` |  | `"Filters"` | Trigger label text. |

## Slots

### `slot` {#slot-slot}

Scoped slot.

## Events

### `hide-filter-form` {#event-hide-filter-form}

## Source

`client/lib/form/filter/FilterMenu.vue`