Sidebar Filters

Renders a column of nested menus containing filters with a submit button, active filters are shown and can be canceled

Import

import { SidebarFilters } from '@smile/haring-react';

Storybook Docs

Name	Type	Default	Description
activeFilters	`ISidebarFilter[]`	`[]`	Array of active filter values
defaultOpenedActiveFilters	`booleane`	`true`	Define if collapse of active filters tags is opened
defaultOpenedMenuIds	`number \| string`	`[]`	Default collapse menu opened
deleteButtonLabel	`string`	`"Remove all"`	Label of button that removes all active filters
filterButtonLabel	`string`	`"Filter"`	Label of submit button
menus	`IMenuItem<string \| number>[]`	`[]`	Array of nested menus containing filters
title	`ReactNode`	`"Active filters"`	Title shown at the top of the column
closeAllFiltersLabel	`string`	`"Close all"`	Label of button close all filters
onDeleteButtonClick	`(filters: ISidebarFilter[]) => void`	-	Called when an active filter is removed
onFilterButtonClick	`(filters: ISidebarFilter[]) => void`	-	Called when submit button is clicked
openAllFiltersLabel	`string`	`"Open all"`	Label of button open all filters

Attribute	Type	Description
categoryId	`(number \| string)[]`	Array of parents ids in the menus
id	`number \| string`	Nested array of menus
label	`string`	Filter(s) contained in the menu
onRemove	`(filter: ISidebarFilter) => void`	Filter(s) contained in the menu
value	`unknown`	Filter(s) contained in the menu