instantsearch.js 4.55.0 → 4.56.0

package/es/components/Breadcrumb/Breadcrumb.d.ts

@@ -10,8 +10,8 @@ export type BreadcrumbProps = {
     items: BreadcrumbConnectorParamsItem[];
     cssClasses: BreadcrumbComponentCSSClasses;
     templateProps: PreparedTemplateProps<BreadcrumbComponentTemplates>;
-    createURL(value?: string | null): string;
-    refine(value?: string | null): void;
+    createURL: (value: BreadcrumbConnectorParamsItem['value']) => string;
+    refine: (value: BreadcrumbConnectorParamsItem['value']) => void;
     canRefine?: boolean;
 };
 declare const Breadcrumb: ({ items, cssClasses, templateProps, createURL, refine, }: BreadcrumbProps) => h.JSX.Element;

package/es/components/Breadcrumb/Breadcrumb.js

@@ -19,10 +19,10 @@ var Breadcrumb = function Breadcrumb(_ref) {
     rootTagName: "a",
     rootProps: {
       className: cssClasses.link,
-      href: createURL(undefined),
+      href: createURL(null),
       onClick: function onClick(event) {
         event.preventDefault();
-        refine(undefined);
+        refine(null);
       }
     }
   }))), items.map(function (item, idx) {

package/es/components/GeoSearchControls/GeoSearchButton.d.ts

@@ -3,7 +3,7 @@ import { h } from 'preact';
 import type { ComponentChildren } from 'preact';
 type Props = {
     className: string;
-    onClick(event: MouseEvent): void;
+    onClick: (event: MouseEvent) => void;
     children: ComponentChildren;
     disabled?: boolean;
 };

package/es/components/GeoSearchControls/GeoSearchControls.d.ts

@@ -11,9 +11,9 @@ type Props = {
     isRefineOnMapMove: boolean;
     isRefinedWithMap: boolean;
     hasMapMoveSinceLastRefine: boolean;
-    onRefineToggle(event: Event): void;
-    onRefineClick(event: MouseEvent): void;
-    onClearClick(event: MouseEvent): void;
+    onRefineToggle: (event: Event) => void;
+    onRefineClick: (event: MouseEvent) => void;
+    onClearClick: (event: MouseEvent) => void;
     templateProps: PreparedTemplateProps<GeoSearchTemplates>;
 };
 declare const GeoSearchControls: ({ cssClasses, enableRefine, enableRefineControl, enableClearMapRefinement, isRefineOnMapMove, isRefinedWithMap, hasMapMoveSinceLastRefine, onRefineToggle, onRefineClick, onClearClick, templateProps, }: Props) => h.JSX.Element;

package/es/components/GeoSearchControls/GeoSearchToggle.d.ts

@@ -5,7 +5,7 @@ type Props = {
     classNameLabel: string;
     classNameInput: string;
     checked: boolean;
-    onToggle(event: Event): void;
+    onToggle: (event: Event) => void;
     children: ComponentChildren;
 };
 declare const GeoSearchToggle: ({ classNameLabel, classNameInput, checked, onToggle, children, }: Props) => h.JSX.Element;

package/es/components/Pagination/Pagination.d.ts

@@ -5,7 +5,7 @@ import type { PaginationCSSClasses, PaginationTemplates } from '../../widgets/pa
 export type PaginationComponentCSSClasses = ComponentCSSClasses<PaginationCSSClasses>;
 export type PaginationComponentTemplates = Required<PaginationTemplates>;
 export type PaginationProps = {
-    createURL(value: number): string;
+    createURL: (value: number) => string;
     cssClasses: PaginationComponentCSSClasses;
     templates: PaginationComponentTemplates;
     currentPage: number;
@@ -13,7 +13,7 @@ export type PaginationProps = {
     pages: number[];
     isFirstPage: boolean;
     isLastPage: boolean;
-    setCurrentPage(value: number): void;
+    setCurrentPage: (value: number) => void;
     showFirst?: boolean;
     showLast?: boolean;
     showPrevious?: boolean;

package/es/components/RangeInput/RangeInput.d.ts

@@ -14,12 +14,15 @@ export type RangeInputProps = {
     templateProps: {
         templates: RangeInputComponentTemplates;
     };
-    refine(rangeValue: RangeBoundaries): void;
+    refine: (rangeValue: RangeBoundaries) => void;
 };
-declare class RangeInput extends Component<RangeInputProps, Partial<Range>> {
+declare class RangeInput extends Component<RangeInputProps, {
+    min?: string;
+    max?: string;
+}> {
     state: {
-        min: import("../../connectors/range/connectRange").RangeMin;
-        max: import("../../connectors/range/connectRange").RangeMax;
+        min: string | undefined;
+        max: string | undefined;
     };
     componentWillReceiveProps(nextProps: RangeInputProps): void;
     private onInput;

package/es/components/RangeInput/RangeInput.js

@@ -16,10 +16,17 @@ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input ==
 import { cx } from '@algolia/ui-components-shared';
 import { h, Component } from 'preact';
 import Template from "../Template/Template.js";
+// Strips leading `0` from a positive number value
+function stripLeadingZeroFromInput(value) {
+  return value.replace(/^(0+)\d/, function (part) {
+    return Number(part).toString();
+  });
+}
 var RangeInput = /*#__PURE__*/function (_Component) {
   _inherits(RangeInput, _Component);
   var _super = _createSuper(RangeInput);
   function RangeInput() {
+    var _this$props$values$mi, _this$props$values$ma;
     var _this;
     _classCallCheck(this, RangeInput);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -27,36 +34,40 @@ var RangeInput = /*#__PURE__*/function (_Component) {
     }
     _this = _super.call.apply(_super, [this].concat(args));
     _defineProperty(_assertThisInitialized(_this), "state", {
-      min: _this.props.values.min,
-      max: _this.props.values.max
+      min: (_this$props$values$mi = _this.props.values.min) === null || _this$props$values$mi === void 0 ? void 0 : _this$props$values$mi.toString(),
+      max: (_this$props$values$ma = _this.props.values.max) === null || _this$props$values$ma === void 0 ? void 0 : _this$props$values$ma.toString()
     });
     _defineProperty(_assertThisInitialized(_this), "onInput", function (key) {
       return function (event) {
         var _ref = event.currentTarget,
           value = _ref.value;
-        _this.setState(_defineProperty({}, key, Number(value)));
+        _this.setState(_defineProperty({}, key, value));
       };
     });
     _defineProperty(_assertThisInitialized(_this), "onSubmit", function (event) {
       event.preventDefault();
-      _this.props.refine([_this.state.min, _this.state.max]);
+      var _this$state = _this.state,
+        min = _this$state.min,
+        max = _this$state.max;
+      _this.props.refine([min ? Number(min) : undefined, max ? Number(max) : undefined]);
     });
     return _this;
   }
   _createClass(RangeInput, [{
     key: "componentWillReceiveProps",
     value: function componentWillReceiveProps(nextProps) {
+      var _nextProps$values$min, _nextProps$values$max;
       this.setState({
-        min: nextProps.values.min,
-        max: nextProps.values.max
+        min: (_nextProps$values$min = nextProps.values.min) === null || _nextProps$values$min === void 0 ? void 0 : _nextProps$values$min.toString(),
+        max: (_nextProps$values$max = nextProps.values.max) === null || _nextProps$values$max === void 0 ? void 0 : _nextProps$values$max.toString()
       });
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$state = this.state,
-        minValue = _this$state.min,
-        maxValue = _this$state.max;
+      var _this$state2 = this.state,
+        minValue = _this$state2.min,
+        maxValue = _this$state2.max;
       var _this$props = this.props,
         min = _this$props.min,
         max = _this$props.max,
@@ -79,7 +90,7 @@ var RangeInput = /*#__PURE__*/function (_Component) {
         min: min,
         max: max,
         step: step,
-        value: minValue !== null && minValue !== void 0 ? minValue : '',
+        value: stripLeadingZeroFromInput(minValue !== null && minValue !== void 0 ? minValue : ''),
         onInput: this.onInput('min'),
         placeholder: min === null || min === void 0 ? void 0 : min.toString(),
         disabled: isDisabled
@@ -97,7 +108,7 @@ var RangeInput = /*#__PURE__*/function (_Component) {
         min: min,
         max: max,
         step: step,
-        value: maxValue !== null && maxValue !== void 0 ? maxValue : '',
+        value: stripLeadingZeroFromInput(maxValue !== null && maxValue !== void 0 ? maxValue : ''),
         onInput: this.onInput('max'),
         placeholder: max === null || max === void 0 ? void 0 : max.toString(),
         disabled: isDisabled

package/es/components/RefinementList/RefinementList.d.ts

@@ -54,7 +54,6 @@ declare class RefinementList<TTemplates extends Templates> extends Component<Ref
         depth: number;
     };
     private searchBox;
-    constructor(props: RefinementListPropsWithDefaultProps<TTemplates>);
     shouldComponentUpdate(nextProps: RefinementListPropsWithDefaultProps<TTemplates>): boolean;
     private refine;
     private _generateFacetItem;

package/es/components/RefinementList/RefinementList.js

@@ -34,49 +34,36 @@ function isHierarchicalMenuItem(facetValue) {
 var RefinementList = /*#__PURE__*/function (_Component) {
   _inherits(RefinementList, _Component);
   var _super = _createSuper(RefinementList);
-  function RefinementList(props) {
+  function RefinementList() {
     var _this;
     _classCallCheck(this, RefinementList);
-    _this = _super.call(this, props);
-    _defineProperty(_assertThisInitialized(_this), "searchBox", createRef());
-    _this.handleItemClick = _this.handleItemClick.bind(_assertThisInitialized(_this));
-    return _this;
-  }
-  _createClass(RefinementList, [{
-    key: "shouldComponentUpdate",
-    value: function shouldComponentUpdate(nextProps) {
-      var areFacetValuesDifferent = !isEqual(this.props.facetValues, nextProps.facetValues);
-      return areFacetValuesDifferent;
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
     }
-  }, {
-    key: "refine",
-    value: function refine(facetValueToRefine) {
-      this.props.toggleRefinement(facetValueToRefine);
-    }
-  }, {
-    key: "_generateFacetItem",
-    value: function _generateFacetItem(facetValue) {
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "searchBox", createRef());
+    _defineProperty(_assertThisInitialized(_this), "_generateFacetItem", function (facetValue) {
       var subItems;
       if (isHierarchicalMenuItem(facetValue) && Array.isArray(facetValue.data) && facetValue.data.length > 0) {
-        var _this$props$cssClasse = this.props.cssClasses,
+        var _this$props$cssClasse = _this.props.cssClasses,
           root = _this$props$cssClasse.root,
           cssClasses = _objectWithoutProperties(_this$props$cssClasse, _excluded);
-        subItems = h(RefinementList, _extends({}, this.props, {
+        subItems = h(RefinementList, _extends({}, _this.props, {
           // We want to keep `root` required for external usage but not for the
           // sub items.
           cssClasses: cssClasses,
-          depth: this.props.depth + 1,
+          depth: _this.props.depth + 1,
           facetValues: facetValue.data,
           showMore: false,
-          className: this.props.cssClasses.childList
+          className: _this.props.cssClasses.childList
         }));
       }
-      var url = this.props.createURL(facetValue.value);
+      var url = _this.props.createURL(facetValue.value);
       var templateData = _objectSpread(_objectSpread({}, facetValue), {}, {
         url: url,
-        attribute: this.props.attribute,
-        cssClasses: this.props.cssClasses,
-        isFromSearch: this.props.isFromSearch
+        attribute: _this.props.attribute,
+        cssClasses: _this.props.cssClasses,
+        isFromSearch: _this.props.isFromSearch
       });
       var key = facetValue.value;
       if (facetValue.isRefined !== undefined) {
@@ -85,38 +72,20 @@ var RefinementList = /*#__PURE__*/function (_Component) {
       if (facetValue.count !== undefined) {
         key += "/".concat(facetValue.count);
       }
-      var refinementListItemClassName = cx(this.props.cssClasses.item, facetValue.isRefined && this.props.cssClasses.selectedItem, !facetValue.count && this.props.cssClasses.disabledItem, Boolean(isHierarchicalMenuItem(facetValue) && Array.isArray(facetValue.data) && facetValue.data.length > 0) && this.props.cssClasses.parentItem);
+      var refinementListItemClassName = cx(_this.props.cssClasses.item, facetValue.isRefined && _this.props.cssClasses.selectedItem, !facetValue.count && _this.props.cssClasses.disabledItem, Boolean(isHierarchicalMenuItem(facetValue) && Array.isArray(facetValue.data) && facetValue.data.length > 0) && _this.props.cssClasses.parentItem);
       return h(RefinementListItem, {
         templateKey: "item",
         key: key,
         facetValueToRefine: facetValue.value,
-        handleClick: this.handleItemClick,
+        handleClick: _this.handleItemClick,
         isRefined: facetValue.isRefined,
         className: refinementListItemClassName,
         subItems: subItems,
         templateData: templateData,
-        templateProps: this.props.templateProps
+        templateProps: _this.props.templateProps
       });
-    }
-
-    // Click events on DOM tree like LABEL > INPUT will result in two click events
-    // instead of one.
-    // No matter the framework, see https://www.google.com/search?q=click+label+twice
-    //
-    // Thus making it hard to distinguish activation from deactivation because both click events
-    // are very close. Debounce is a solution but hacky.
-    //
-    // So the code here checks if the click was done on or in a LABEL. If this LABEL
-    // has a checkbox inside, we ignore the first click event because we will get another one.
-    //
-    // We also check if the click was done inside a link and then e.preventDefault() because we already
-    // handle the url
-    //
-    // Finally, we always stop propagation of the event to avoid multiple levels RefinementLists to fail: click
-    // on child would click on parent also
-  }, {
-    key: "handleItemClick",
-    value: function handleItemClick(_ref) {
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleItemClick", function (_ref) {
       var facetValueToRefine = _ref.facetValueToRefine,
         isRefined = _ref.isRefined,
         originalEvent = _ref.originalEvent;
@@ -133,7 +102,7 @@ var RefinementList = /*#__PURE__*/function (_Component) {
         return;
       }
       if (originalEvent.target.tagName === 'INPUT') {
-        this.refine(facetValueToRefine);
+        _this.refine(facetValueToRefine);
         return;
       }
       var parent = originalEvent.target;
@@ -147,7 +116,20 @@ var RefinementList = /*#__PURE__*/function (_Component) {
         parent = parent.parentNode;
       }
       originalEvent.stopPropagation();
-      this.refine(facetValueToRefine);
+      _this.refine(facetValueToRefine);
+    });
+    return _this;
+  }
+  _createClass(RefinementList, [{
+    key: "shouldComponentUpdate",
+    value: function shouldComponentUpdate(nextProps) {
+      var areFacetValuesDifferent = !isEqual(this.props.facetValues, nextProps.facetValues);
+      return areFacetValuesDifferent;
+    }
+  }, {
+    key: "refine",
+    value: function refine(facetValueToRefine) {
+      this.props.toggleRefinement(facetValueToRefine);
     }
   }, {
     key: "componentWillReceiveProps",

package/es/components/RelevantSort/RelevantSort.d.ts

@@ -9,7 +9,7 @@ type RelevantSortProps = {
     templates: RelevantSortComponentTemplates;
     isRelevantSorted: boolean;
     isVirtualReplica: boolean;
-    refine(relevancyStrictness: number | undefined): void;
+    refine: (relevancyStrictness: number | undefined) => void;
 };
 declare const RelevantSort: ({ cssClasses, templates, isRelevantSorted, isVirtualReplica, refine, }: RelevantSortProps) => h.JSX.Element | null;
 export default RelevantSort;

package/es/components/Selector/Selector.d.ts

@@ -1,7 +1,7 @@
 
 import { h } from 'preact';
 export type SelectorOption = {
-    value?: string | number;
+    value: string | number | undefined;
     label: string;
 };
 export type SelectorComponentCSSClasses = {
@@ -13,7 +13,7 @@ export type SelectorProps = {
     cssClasses: SelectorComponentCSSClasses;
     currentValue?: string | number;
     options: SelectorOption[];
-    setValue(value: SelectorOption['value']): void;
+    setValue: (value: string) => void;
 };
 declare function Selector({ currentValue, options, cssClasses, setValue, }: SelectorProps): h.JSX.Element;
 export default Selector;

package/es/components/Slider/Rheostat.d.ts

@@ -40,6 +40,12 @@ export type HandleProps = {
     style: JSX.HTMLAttributes['style'];
     tabIndex: number;
 };
+type Bounds = [min: number, max: number];
+type PublicState = {
+    max?: number;
+    min?: number;
+    values: Bounds;
+};
 type Props = {
     children?: ComponentChildren;
     className?: string;
@@ -47,24 +53,24 @@ type Props = {
     handle?: ComponentType<HandleProps>;
     max?: number;
     min?: number;
-    onClick?(...args: unknown[]): unknown;
-    onChange?(...args: unknown[]): unknown;
-    onKeyPress?(...args: unknown[]): unknown;
-    onSliderDragEnd?(...args: unknown[]): unknown;
-    onSliderDragMove?(...args: unknown[]): unknown;
-    onSliderDragStart?(...args: unknown[]): unknown;
-    onValuesUpdated?(...args: unknown[]): unknown;
+    onClick?: () => void;
+    onChange?: (state: PublicState) => void;
+    onKeyPress?: () => void;
+    onSliderDragEnd?: () => void;
+    onSliderDragMove?: () => void;
+    onSliderDragStart?: () => void;
+    onValuesUpdated?: (state: PublicState) => void;
     orientation?: 'horizontal' | 'vertical';
     pitComponent?: ComponentType<PitProps>;
     pitPoints?: number[];
     progressBar?: ComponentType<JSX.HTMLAttributes>;
     snap?: boolean;
     snapPoints?: number[];
-    values?: number[];
+    values?: Bounds;
 };
 type State = {
     className: string;
-    handlePos: number[];
+    handlePos: Bounds;
     handleDimensions: number;
     mousePos: {
         x: number;
@@ -72,7 +78,7 @@ type State = {
     } | null;
     sliderBox: Partial<BoundingBox>;
     slidingIndex: number | null;
-    values: number[];
+    values: Bounds;
 };
 declare class Rheostat extends Component<Props, State> {
     static defaultProps: {
@@ -97,10 +103,10 @@ declare class Rheostat extends Component<Props, State> {
         snapPoints: never[];
         values: number[];
     };
+    x: number[];
     state: State;
     private rheostat;
-    constructor(props: Props);
-    componentWillReceiveProps(nextProps: Required<Props>): void;
+    componentWillReceiveProps: (nextProps: Required<Props>) => void;
     private getPublicState;
     private getSliderBoundingBox;
     private getProgressStyle;
@@ -123,10 +129,10 @@ declare class Rheostat extends Component<Props, State> {
     private handleKeydown;
     private validatePosition;
     private validateValues;
-    canMove(idx: number, proposedPosition: number): boolean;
-    fireChangeEvent(): void;
-    slideTo(idx: number, proposedPosition: number, onAfterSet?: () => void): void;
-    updateNewValues(nextProps: Required<Props>): void;
-    render(): h.JSX.Element;
+    canMove: (idx: number, proposedPosition: number) => boolean;
+    fireChangeEvent: () => void;
+    slideTo: (idx: number, proposedPosition: number, onAfterSet?: () => void) => void;
+    updateNewValues: (nextProps: Required<Props>) => void;
+    render: () => h.JSX.Element;
 }
 export default Rheostat;