searchkit-recharts

Recharts components for Searchkit

Installation

npm install searchkit-recharts --save

Features

• PieFilterList : Pie chart to use filter list.

Usage

import { PieFilterList } from "searchkit-daterangefilter"

  <RefinementListFilter
    listComponent={PieFilterList}
    operator="OR"
    field="type.raw"
    title="Categories"
    id="categories"/>

Example

const Demo = React.createClass({
  render() {
    return (
      <SearchkitProvider searchkit={searchkit}>
        <Layout>
          <TopBar>
            <SearchBox
              autofocus={true}
              searchOnChange={true}
              prefixQueryFields={["actors^1","type^2","languages","title^10"]}/>
          </TopBar>
          <LayoutBody>
            <SideBar>
              <RefinementListFilter
                listComponent={PieFilterList}
                operator="OR"
                field="type.raw"
                title="Categories"
                id="categories"/>
            </SideBar>
            <LayoutResults>
              <Hits mod="sk-hits-grid" hitsPerPage={10} itemComponent={MovieHitsGridItem}
                sourceFilter={["title", "poster", "imdbId"]}/>
              <NoHits/>
            </LayoutResults>
          </LayoutBody>
        </Layout>
      </SearchkitProvider>
    )
  }
})

License

MIT