> ## Documentation Index
> Fetch the complete documentation index at: https://algolia.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Clear Filters

> Lets users reset all applied search refinements.

<div className="not-prose algolia-flavor-switcher">
  <div className="afs-dropdown">
    <div className="afs-trigger" role="button" tabIndex="0" aria-haspopup="listbox">
      <span className="afs-current">iOS</span>

      <svg className="afs-chevron lucide lucide-chevron-down" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
        <path d="m6 9 6 6 6-6" />
      </svg>
    </div>

    <ul className="afs-menu" role="listbox">
      <li role="option" aria-selected="false"><a className="afs-option" href="/doc/api-reference/widgets/clear-refinements/js"><span className="afs-option-name">JavaScript</span><span className="afs-option-lib">InstantSearch.js</span></a></li>
      <li role="option" aria-selected="false"><a className="afs-option" href="/doc/api-reference/widgets/clear-refinements/react"><span className="afs-option-name">React</span><span className="afs-option-lib">React InstantSearch</span></a></li>
      <li role="option" aria-selected="false"><a className="afs-option" href="/doc/api-reference/widgets/clear-refinements/vue"><span className="afs-option-name">Vue</span><span className="afs-option-lib">Vue InstantSearch</span></a></li>
      <li role="option" aria-selected="true"><a className="afs-option is-current" href="/doc/api-reference/widgets/clear-refinements/ios"><span className="afs-option-name">iOS</span><span className="afs-option-lib">InstantSearch iOS</span></a></li>
      <li role="option" aria-selected="false"><a className="afs-option" href="/doc/api-reference/widgets/clear-refinements/android"><span className="afs-option-name">Android</span><span className="afs-option-lib">InstantSearch Android</span></a></li>
      <li role="option" aria-selected="false"><a className="afs-option" href="/doc/api-reference/widgets/clear-refinements/flutter"><span className="afs-option-name">Flutter</span><span className="afs-option-lib">Algolia for Flutter</span></a></li>
    </ul>
  </div>
</div>

```swift Signature theme={"system"}
FilterClearConnector(
  filterState: FilterState,
  interactor: FilterClearInteractor,
  clearMode: ClearMode,
  filterGroupIDs: [FilterGroup.ID]?,
  controller: FilterClearController
)
```

<Card title="Explore example code" icon="github" href="https://github.com/algolia/instantsearch-ios/tree/master/Examples/Showcase">
  Browse the Clear Filters example code on GitHub.
</Card>

## About this widget

`Clear Filters` lets users clear all filters that are currently active within the given `FilterState`.

## Examples

Instantiate a `FilterClearConnector`.

```swift Swift icon=code theme={"system"}
let filterState: FilterState = .init()
let clearFiltersController: FilterClearButtonController = .init(button: UIButton())

let filterClearConnector: FilterClearConnector = .init(filterState: filterState,
                                                       clearMode: .specified,
                                                       filterGroupIDs: [.and(name: "color"), .or(name: "category",
                                                                                                 filterType: .facet)],
                                                       controller: clearFiltersController)
```

## Parameters

<ParamField body="filterState" type="FilterState" required>
  The [`FilterState`](/doc/api-reference/widgets/filter-state/ios) that holds your filters.
</ParamField>

<ParamField body="interactor" type="FilterClearInteractor" post={["default: .init()"]} required>
  The logic applied to Clear Filters.
</ParamField>

<ParamField body="clearMode" type="ClearMode" post={["default: .specified"]}>
  Whether we should clear the `specified` filters or all filters `except` them.
</ParamField>

<ParamField body="filterGroupIDs" type="[FilterGroup.ID]?" post={["default: nil"]}>
  The group IDs of filters to clear.
  All filters will be cleared if unspecified.
</ParamField>

<ParamField body="controller" type="FilterClearController" post={["default: nil"]}>
  The Controller interfacing with a concrete clear filters view.
</ParamField>

## Low-level API

If you want to fully control the `Clear Filters` components and connect them manually,
use the following components:

* `FilterClearInteractor`. The logic for clearing filters in the `FilterState`.
* `FilterState`. The current state of the filters.
* `FilterClearController`. The controller that interfaces with a concrete clear filters view.

```swift Swift icon=code theme={"system"}
let filterState: FilterState = .init()
let filterClearInteractor: FilterClearInteractor = .init()
let clearFiltersController: FilterClearButtonController = .init(button: UIButton())

filterClearInteractor.connectFilterState(filterState,
                                         filterGroupIDs: [
                                          .and(name: "color"),
                                          .or(name: "category", filterType: .facet)
                                         ],
                                         clearMode: .specified)
filterClearInteractor.connectController(clearFiltersController)
```

## Customizing your view

The controllers provided by default,
like the `FilterClearButtonController` work well when you want to use native UIKit with their default behavior.

If you want to use another component (other than a `UIButton`) such as a `UIView`,
a third-party input view,
or you want to introduce some custom behavior to the already provided UIKit component,
you can create your own controller conforming to the `FilterClearController` protocol.

### Protocol

`var onClick: ((Facet) -> Void)?`:

Closure to call when the clear filters button is clicked.

### Example

```swift Swift icon=code theme={"system"}
public class FilterClearButtonController: FilterClearController {

  public let button: UIButton

  public var onClick: (() -> Void)?

  public init(button: UIButton) {
    self.button = button
    button.addTarget(self, action: #selector(didTapButton), for: .touchUpInside)
  }

  @objc private func didTapButton() {
    onClick?()
  }

}
```

### SwiftUI

InstantSearch provides the `FilterClearObservableController` data model,
which is an implementation of the `FilterClearController` protocol adapted for usage with SwiftUI.
`FilterClearObservableController` must be connected to the `FilterClearConnector` or `FilterClearInteractor` like any other `FilterClearController` implementation.

The example of the clear filter view using the `Button` component provided by SwiftUI:

```swift Swift icon=code theme={"system"}
struct ContentView: View {

  @ObservedObject var filterClearController: FilterClearObservableController

  var body: some View {
    Button("Clear filters") {
      filterClearController.clear()
    }
  }

}
```

If you prefer to create a custom clear filters SwiftUI view,
you can directly use the `FilterClearObservableController` as a data model.
It provides the `clear` function to streamline the design process of your custom SwiftUI view.
