ClearAll

Purpose

The ClearAll component is used to display a basic clear all button.

Usage

When the clearAll method is used all applied filters will be removed and pagination set to the first page.

Basic

import React from "react";
import { ClearAll } from "@usereactify/search";

import { ExampleClearAll } from "./ExampleClearAll";

export const Component: React.FC = () => {
  return (
    <ClearAll
      render={ExampleClearAll}
    />
  );
};

ExampleClearAll

import React from "react";
import { ClearAllProps } from "@usereactify/search";

export type ExampleClearAllProps = React.ComponentProps<
  NonNullable<ClearAllProps["render"]>
>;

export const ExampleClearAll: React.FC<ExampleClearAllProps> = (props) => {
  return <a onClick={props.clearAll}>{"Clear All"}</a>;
};

Props

type ClearAllProps = {
  /** Render method */
  render?: React.FC<{
    clearAll: () => void;
  }>;
  /** Render the component even when there are no filters selected (default: false) */
  showWhenEmpty?: boolean;
};