Top 10 Examples of "searchkit in functional component" in JavaScript

SearchBox, Hits, RefinementListFilter, Pagination,
    HierarchicalMenuFilter, HitsStats, SortingSelector, NoHits,
    SelectedFilters, ResetFilters, RangeFilter, NumericRefinementListFilter,
    ViewSwitcherHits, ViewSwitcherToggle,
    Layout, TopBar, LayoutBody, LayoutResults,
    ActionBar, ActionBarRow, SideBar, encodeObjUrl, QueryAccessor
} from "searchkit"

import { MovieHitsGridItem, MovieHitsListItem } from "../../components"

// require("@searchkit/autosuggest/src/styles.css")
require("searchkit/release/theme.css")


const searchkitMovies = new SearchkitManager("http://demo.searchkit.co/api/movies/");
const searchkitTaxonomy = new SearchkitManager("http://demo.searchkit.co/api/taxonomy/")
import "./styles.scss"

const Heading = ({ children }) =&gt; <div>{children}</div>

const App = () =&gt; (
    <div>
        
            
                
                    Taxonomy
                    </div>

module.exports = (url) => {
  const sk = new SearchkitManager(url);

  const story = 
    
  

  // Story specific tests.
  specs(() => describe('Select filter', function () {
    it('Widget should be select with at least two values', function () {

ItemCheckboxList, CheckboxItemList, ItemHistogramList, Select, // ItemList, Tabs, Toggle, TagCloud,

	/* Components - Range */
	//RangeSliderHistogram, RangeSliderHistogramInput, RangeInput, RangeSlider, RangeHistogram, RangeSliderInput, RangeHistogramInput

	// Query DSL
	//MultiMatchQuery, TermQuery, BoolShould, BoolMust, BoolMustNot, RangeQuery, FilteredQuery, MatchQuery, MatchPhrasePrefix, SimpleQueryString,

	/* Filters */
	RefinementListFilter, ResetFilters, MenuFilter, GroupedSelectedFilters, //SelectedFilters, HierarchicalMenuFilter, HierarchicalRefinementFilter, NumericRefinementListFilter ,CheckboxFilter, DynamicRangeFilter, RangeFilter, InputFilter, TagFilter, TagFilterList, TagFilterConfig
} from "searchkit";

require("./index.scss");

const host = (process.env.ELASTIC_URL || "//fccpublicsearch.herokuapp.com/fccnn")
const searchkit = new SearchkitManager(host, {
	searchOnLoad: true,
	useHistory: true,
  basicAuth:(process.env.ELASTIC_AUTH || null)
})

function refreshMe() {
	// NOTE: This is disabled for now until future implementation
	//searchkit.reloadSearch()
	//console.log('refreshed')
}

const InitialLoaderComponent = (props) => {
	const {bemBlocks} = props
	return (
		<div>
    Loading, please wait...</div>

module.exports = (url) => {
  const sk = new SearchkitManager(url);
  
  const story = 
    
  

  // Story specific tests.
  specs(() => describe('Location input', function () {
    it('Location input should have the geosuggest__input class', function () {
      let output = mount(story);
      expect(output.find('input[type="text"]').hasClass('geosuggest__input')).to.be.true;
    });
  }));

constructor() {
    super()
    // const host = "http://localhost:9200/imdb/movies"
    const host = "http://demo.searchkit.co/api/movies"

    this.searchkit = new SearchkitManager(host)
    // this.searchkit.setQueryProcessor(queryOptimizer)
    this.searchkit.translateFunction = (key) => {
      return { "pagination.previous": "<", "pagination.next": ">" }[key]
    }
    this.state = {
      displayMode: "thumbnail",
      operator: "OR"
    }
  }

let defaultCollectionURL =
  "https://buildhub.prod.mozaws.net/v1/buckets/build-hub/collections/releases/";
// There is an exception to this rule, the default (when
// REACT_APP_KINTO_COLLECTION_URL isn't set) depends on how this UI is rendered.
if (
  window.location.pathname &&
  window.location.pathname.search(/\/stage\//) > -1
) {
  defaultCollectionURL =
    "https://buildhub.stage.mozaws.net/v1/buckets/build-hub/collections/releases/";
}
const KINTO_COLLECTION_URL =
  process.env.REACT_APP_KINTO_COLLECTION_URL || defaultCollectionURL;

const searchkit = new SearchkitManager(KINTO_COLLECTION_URL, {
  searchUrlPath: "search"
});

const HitsTable = ({ hits }) => {
  return (
    <div style="{{">
      <table style="{{">
        <thead>
          <tr>
            <th>
            </th><th>Product</th>
            <th>Version</th>
            <th>platform</th></tr></thead></table></div>

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
}

const allFilters = this.getAllFiltersOnPath(query)
      let otherFilters = []
      if (allFilters.length > 0) {
        // Only keep the filters for other elements on this nested path
        otherFilters = R.filter(
          R.compose(
            R.not,
            R.equals(this.getFieldKey()),
            R.head,
            R.keys,
            R.head,
            R.values
          )
        )(allFilters)
      }
      return otherFilters.length > 0 ? BoolMust(otherFilters) : undefined
    }
  }

pageScope?: number // Number of page to show before/after the current number
  listComponent?: any
}

export class Pagination extends SearchkitComponent {
  accessor:PaginationAccessor


  static translations:any = {
    "pagination.previous":"Previous",
    "pagination.next":"Next"
  }
  translations = Pagination.translations

  static propTypes = defaults({
    translations:SearchkitComponent.translationsPropType(
      Pagination.translations
    ),
    showNumbers:React.PropTypes.bool,
    pageScope: React.PropTypes.number,
    listComponent: React.PropTypes.any,
  }, SearchkitComponent.propTypes)

  static defaultProps = {
    listComponent: Toggle
  }

  defineAccessor() {
    return new PaginationAccessor("p")
  }

  getCurrentPage():number {