Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update FilterPicker Component README.md (https://github.com/woocommerce/woocommerce-admin/pull/5928)

This commit is contained in:
manjeet-wisetr 2021-01-25 21:51:57 +05:30 committed by GitHub
parent 2d106bb0b3
commit 3a792f66d9
1 changed files with 36 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
plugins/woocommerce-admin/packages/components/src/filter-picker/README.md
View File

@ -9,36 +9,44 @@ Modify a url query parameter via a dropdown selection of configurable options. T
import { FilterPicker } from '@woocommerce/components';
const renderFilterPicker = () => {
const filters = [
{ label: 'Breakfast', value: 'breakfast' },
{
label: 'Lunch',
value: 'lunch',
subFilters: [
{ label: 'Meat', value: 'meat', path: [ 'lunch' ] },
{ label: 'Vegan', value: 'vegan', path: [ 'lunch' ] },
{
label: 'Pescatarian',
value: 'fish',
path: [ 'lunch' ],
subFilters: [
{ label: 'Snapper', value: 'snapper', path: [ 'lunch', 'fish' ] },
{ label: 'Cod', value: 'cod', path: [ 'lunch', 'fish' ] },
// Specify a custom component to render (Work in Progress)
{
label: 'Other',
value: 'other_fish',
path: [ 'lunch', 'fish' ],
component: 'OtherFish',
},
],
},
],
const config = {
label: 'Meal',
staticParams: [],
param: 'meal',
showFilters: function showFilters() {
return true;
},
{ label: 'Dinner', value: 'dinner' },
];
filters: [
{ label: 'Breakfast', value: 'breakfast' },
{
label: 'Lunch',
value: 'lunch',
subFilters: [
{ label: 'Meat', value: 'meat', path: [ 'lunch' ] },
{ label: 'Vegan', value: 'vegan', path: [ 'lunch' ] },
{
label: 'Pescatarian',
value: 'fish',
path: [ 'lunch' ],
subFilters: [
{ label: 'Snapper', value: 'snapper', path: [ 'lunch', 'fish' ] },
{ label: 'Cod', value: 'cod', path: [ 'lunch', 'fish' ] },
// Specify a custom component to render (Work in Progress)
{
label: 'Other',
value: 'other_fish',
path: [ 'lunch', 'fish' ],
component: 'OtherFish'
},
],
},
],
},
{ label: 'Dinner', value: 'dinner' },
],
};
return <FilterPicker filters={ filters } path={ path } query={ query } />;
return <FilterPicker config={ config } path={ path } query={ query } />;
};
```