How to use the searchkit.SearchkitComponent.propTypes function in searchkit

title: React.PropTypes.string.isRequired,
    id: React.PropTypes.string.isRequired,
    translations: SearchkitComponent.translationsPropType(
        FacetAccessor.translations
    ),
    orderKey: React.PropTypes.string,
    orderDirection: React.PropTypes.oneOf(["asc", "desc"]),
    include: React.PropTypes.oneOfType([
        React.PropTypes.string, React.PropTypes.array
    ]),
    exclude: React.PropTypes.oneOfType([
        React.PropTypes.string, React.PropTypes.array
    ]),
    collapsable: React.PropTypes.bool,
    showCount: React.PropTypes.bool,
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    listComponent: CheckboxItemList,
    containerComponent: Panel,
    // component: RefinementListFilterDisplay,
    // itemComponent: FilterCheckboxItemComponent,
    size: 50,
    collapsable: false,
    showCount: true
  }

  constructor(props){
    super(props)

    this.toggleViewMoreOption = this.toggleViewMoreOption.bind(this)
  }

onChange: this.sliderUpdate,
            onFinished: this.sliderUpdateAndSearch
          })}
        
      
    )
  }
}

DateRangeFilter.propTypes = defaults({
  field:React.PropTypes.string.isRequired,
  title:React.PropTypes.string.isRequired,
  id:React.PropTypes.string.isRequired,
  // containerComponent:RenderComponentPropType,
  // rangeComponent:RenderComponentPropType
}, SearchkitComponent.propTypes)

DateRangeFilter.defaultProps = {
  containerComponent: Panel,
  rangeComponent: RangeSliderHistogram,
  showHistogram: true
}

}

export class CheckboxFilter extends SearchkitComponent {
  accessor: CheckboxFilterAccessor

  static propTypes = defaults({
    id: React.PropTypes.string.isRequired,
    title: React.PropTypes.string.isRequired,
    label: React.PropTypes.string.isRequired,
    filter: React.PropTypes.object.isRequired,
    translations: SearchkitComponent.translationsPropType(
        CheckboxFilterAccessor.translations
    ),
    collapsable: React.PropTypes.bool,
    showCount: React.PropTypes.bool,
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    listComponent: CheckboxItemList,
    containerComponent: Panel,
    collapsable: false,
    showCount: true
  }

  constructor(props){
    super(props)
    this.toggleFilter = this.toggleFilter.bind(this)
  }

  defineAccessor() {
    const { id, title, translations, label, filter } = this.props;
    return new CheckboxFilterAccessor(id, {

}

  translations = CRUKSearchkitNoResults.translations

  static propTypes = defaults({
    suggestionsField:React.PropTypes.string,
    errorComponent: React.PropTypes.func,
    component: React.PropTypes.func,
    noResultsLabel: React.PropTypes.object,
    noResultsTitle: React.PropTypes.string,
    noResultsBody: React.PropTypes.object,
    errorMessage: React.PropTypes.string,
    translations:SearchkitComponent.translationsPropType(
      CRUKSearchkitNoResults.translations
    )
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    errorComponent: CRUKSearchkitNoResultsErrorDisplay,
    component: CRUKSearchkitNoResultsDisplay
  }

  componentWillMount(){
    super.componentWillMount()
    this.noFiltersAccessor = this.searchkit.addAccessor(
      new NoFiltersHitCountAccessor()
    )
    if(this.props.suggestionsField){
      this.suggestionsAccessor = this.searchkit.addAccessor(
        new SuggestionsAccessor(this.props.suggestionsField)
      )
    }

static propTypes = {
    startDate: React.PropTypes.object,
    endDate: React.PropTypes.object,
    numberOfMonths: React.PropTypes.number,
    initialVisibleMonth: React.PropTypes.func,
    onDatesChange: React.PropTypes.func,
    onFocusChange: React.PropTypes.func,
    focusedInput: React.PropTypes.bool,
    displayFormat: React.PropTypes.string,
    showClearDates: React.PropTypes.bool,
    field: React.PropTypes.string,
    startDateField: React.PropTypes.string,
    endDateField: React.PropTypes.string,
    id: React.PropTypes.string,
    ...SearchkitComponent.propTypes
  }

  constructor(props) {
    const startDate = (props.startDate) ? props.startDate : null
    const endDate = (props.endDate) ? props.endDate : null
    super(props)

    this.state = {
      focusedInput: null,
      startDate: startDate,
      endDate: endDate,
      initialVisibleMonth: () => moment()
    }

    this.noArgs = true

renderComponent
} from 'searchkit';

import { CRUKSearchkitLocationAccessor } from './CRUKSearchkitLocationAccessor';

export default class CRUKSearchkitLocationInput extends SearchkitComponent {
  accessor:CRUKSearchkitLocationAccessor

  static propTypes = {
    queryDelay: React.PropTypes.number,
    placeholder: React.PropTypes.string,
    initialValue: React.PropTypes.string,
    radius: React.PropTypes.string,
    location: React.PropTypes.object,
    fixtures: React.PropTypes.array,
    ...SearchkitComponent.propTypes,
  }

  constructor(props) {
    super(props);

    this.state = {
      lat: null,
      lng: null,
      placeId: null,
      searchedAddress: null
    };

    this.preformedSearch = false;

    this.onSuggestSelect = this.onSuggestSelect.bind(this);
    this.getSelectedLocation = this.getSelectedLocation.bind(this);

static propTypes = defaults({
    field: React.PropTypes.string.isRequired,
    title: React.PropTypes.string.isRequired,
    id: React.PropTypes.string.isRequired,
    size: React.PropTypes.number,
    orderKey: React.PropTypes.string,
    orderDirection: React.PropTypes.oneOf(["asc", "desc"]),
    include: React.PropTypes.oneOfType([
      React.PropTypes.string, React.PropTypes.array
    ]),
    exclude: React.PropTypes.oneOfType([
      React.PropTypes.string, React.PropTypes.array
    ]),
    collapsable: React.PropTypes.bool,
    showCount: React.PropTypes.bool,
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    listComponent: ItemList,
    containerComponent: Panel,
    collapsable: false,
    showCount: false,
    size: 50
  }

  defineAccessor() {
    const {
      field, id, size, title,
      include, exclude, orderKey, orderDirection
    } = this.props
    const operator = "OR"
    return new FacetAccessor(field, {

SearchkitComponentProps,
  ReactComponentType
} from "searchkit"

import { FilterGroup } from '../ui'

const _ = require('lodash')

export interface GroupedSelectedFiltersProps extends SearchkitComponentProps {
  listComponent?: ReactComponentType
}

export class GroupedSelectedFilters extends SearchkitComponent {

  static propTypes = _.defaults({
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    listComponent: FilterGroup
  }

  constructor(props) {
    super(props)
    this.translate = this.translate.bind(this)
    this.removeFilter = this.removeFilter.bind(this)
    this.removeFilters = this.removeFilters.bind(this)
  }

  defineBEMBlocks() {
    const blockName = (this.props.mod || "sk-filter-group")
    return {
      container: blockName,

static propTypes = defaults({
    listComponent: React.PropTypes.any,
    field:React.PropTypes.string.isRequired,
    title:React.PropTypes.string.isRequired,
    id:React.PropTypes.string.isRequired,
    multiselect: React.PropTypes.bool,
    showCount: React.PropTypes.bool,
    options:React.PropTypes.arrayOf(
      React.PropTypes.shape({
        title:React.PropTypes.string.isRequired,
        from:React.PropTypes.number,
        to:React.PropTypes.number,
        key:React.PropTypes.string
      })
    )
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    listComponent: ItemList,
    containerComponent: Panel,
    multiselect: false,
    showCount: true
  }

  defineAccessor() {
    const {id, field, options, title, multiselect} = this.props
    return new NumericOptionsAccessor(id, {
      id, field, options, title, multiselect
    })
  }

  toggleFilter(key) {

title:string
  interval?:number
  showHistogram?:boolean
  containerComponent?: ReactComponentType
  rangeComponent?: ReactComponentType
  collapsable?: boolean
}

export class RangeFilter extends SearchkitComponent {
  accessor:RangeAccessor

  static propTypes = defaults({
    field:React.PropTypes.string.isRequired,
    title:React.PropTypes.string.isRequired,
    id:React.PropTypes.string.isRequired,
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    containerComponent: Panel,
    rangeComponent: RangeSliderHistogram,
    showHistogram: true,
    collapsable: false
  }

  constructor(props){
    super(props)
    this.sliderUpdate = this.sliderUpdate.bind(this)
    this.sliderUpdateAndSearch = this.sliderUpdateAndSearch.bind(this)
  }

  defineAccessor() {
    const { id, title, min, max, field, interval } = this.props