connectors connectRange

Description

Range connector provides the logic to create custom widget that will let the user refine results using a numeric range.

This connectors provides a refine() function that accepts bounds. It will also provide information about the min and max bounds for the current result set.

Usage

const search= instantsearch(/* parameters */);

const makeRange= instantsearch.connectors.connectRange(
  function renderFn(
      renderOpts: RangeRenderingOptions,
      isFirstRendering: boolean) {
    // render the custom Range widget
  }
);

const  customRange = makeRange(instanceOpts: CustomRangeWidgetOptions);
search.addWidget(customRange);

Connector options

RangeRenderingOptions

• refine(Array<number,number>) => undefined

  Sets a range to filter the results on. Both values are optional, and will default to the higher and lower bounds. You can use undefined to remove a previously set bound or to set an infinite bound.

• range{min: number, max: number}

  Results bounds without the current range filter.

• startArray<number,number>

  Current numeric bounds of the search.

• formatter{from: function, to: function}

  Transform for the rendering from and/or to values. Both functions take a number as input and should output a string.

• widgetParamsObject

  All original CustomRangeWidgetOptions forwarded to the renderFn.

CustomRangeWidgetOptions

• attributestring

  Name of the attribute for faceting.

• min[number]
  Default value: undefined

  Minimal range value, default to automatically computed from the result set.

• max[number]
  Default value: undefined

  Maximal range value, default to automatically computed from the result set.

• precision[number]
  Default value: 2

  Number of digits after decimal point to use.

Can't find what you are looking for? Open an issue, we'll get back to you.