instantsearch.js 4.54.1 → 4.56.0

package/cjs/components/Breadcrumb/Breadcrumb.js

@@ -26,10 +26,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/cjs/components/Hits/Hits.js

@@ -4,9 +4,10 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = Hits;
 var _uiComponentsShared = require("@algolia/ui-components-shared");
 var _preact = require("preact");
+var _listener = require("../../lib/insights/listener");
 var _utils = require("../../lib/utils");
 var _Template = _interopRequireDefault(require("../Template/Template"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -16,18 +17,24 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-var Hits = function Hits(_ref) {
+function Hits(_ref) {
   var results = _ref.results,
     hits = _ref.hits,
+    insights = _ref.insights,
     bindEvent = _ref.bindEvent,
     sendEvent = _ref.sendEvent,
     cssClasses = _ref.cssClasses,
     templateProps = _ref.templateProps;
+  var handleInsightsClick = (0, _listener.createInsightsEventHandler)({
+    insights: insights,
+    sendEvent: sendEvent
+  });
   if (results.hits.length === 0) {
     return (0, _preact.h)(_Template.default, _extends({}, templateProps, {
       templateKey: "empty",
       rootProps: {
-        className: (0, _uiComponentsShared.cx)(cssClasses.root, cssClasses.emptyRoot)
+        className: (0, _uiComponentsShared.cx)(cssClasses.root, cssClasses.emptyRoot),
+        onClick: handleInsightsClick
       },
       data: results
     }));
@@ -41,7 +48,11 @@ var Hits = function Hits(_ref) {
       templateKey: "item",
       rootTagName: "li",
       rootProps: {
-        className: cssClasses.item
+        className: cssClasses.item,
+        onClick: function onClick(event) {
+          handleInsightsClick(event);
+          sendEvent('click:internal', hit, 'Hit Clicked');
+        }
       },
       key: hit.objectID,
       data: _objectSpread(_objectSpread({}, hit), {}, {
@@ -54,6 +65,4 @@ var Hits = function Hits(_ref) {
       sendEvent: sendEvent
     }));
   })));
-};
-var _default = Hits;
-exports.default = _default;
+}

package/cjs/components/InfiniteHits/InfiniteHits.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _uiComponentsShared = require("@algolia/ui-components-shared");
 var _preact = require("preact");
+var _listener = require("../../lib/insights/listener");
 var _utils = require("../../lib/utils");
 var _Template = _interopRequireDefault(require("../Template/Template"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -19,6 +20,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 var InfiniteHits = function InfiniteHits(_ref) {
   var results = _ref.results,
     hits = _ref.hits,
+    insights = _ref.insights,
     bindEvent = _ref.bindEvent,
     sendEvent = _ref.sendEvent,
     hasShowPrevious = _ref.hasShowPrevious,
@@ -28,11 +30,16 @@ var InfiniteHits = function InfiniteHits(_ref) {
     isLastPage = _ref.isLastPage,
     cssClasses = _ref.cssClasses,
     templateProps = _ref.templateProps;
+  var handleInsightsClick = (0, _listener.createInsightsEventHandler)({
+    insights: insights,
+    sendEvent: sendEvent
+  });
   if (results.hits.length === 0) {
     return (0, _preact.h)(_Template.default, _extends({}, templateProps, {
       templateKey: "empty",
       rootProps: {
-        className: (0, _uiComponentsShared.cx)(cssClasses.root, cssClasses.emptyRoot)
+        className: (0, _uiComponentsShared.cx)(cssClasses.root, cssClasses.emptyRoot),
+        onClick: handleInsightsClick
       },
       data: results
     }));
@@ -54,7 +61,11 @@ var InfiniteHits = function InfiniteHits(_ref) {
       templateKey: "item",
       rootTagName: "li",
       rootProps: {
-        className: cssClasses.item
+        className: cssClasses.item,
+        onClick: function onClick(event) {
+          handleInsightsClick(event);
+          sendEvent('click:internal', hit, 'Hit Clicked');
+        }
       },
       key: hit.objectID,
       data: _objectSpread(_objectSpread({}, hit), {}, {

package/cjs/components/RangeInput/RangeInput.js

@@ -23,10 +23,17 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+// 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++) {
@@ -34,36 +41,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,
@@ -86,7 +97,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
@@ -104,7 +115,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/cjs/components/RefinementList/RefinementList.js

@@ -41,49 +41,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", (0, _preact.createRef)());
-    _this.handleItemClick = _this.handleItemClick.bind(_assertThisInitialized(_this));
-    return _this;
-  }
-  _createClass(RefinementList, [{
-    key: "shouldComponentUpdate",
-    value: function shouldComponentUpdate(nextProps) {
-      var areFacetValuesDifferent = !(0, _utils.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", (0, _preact.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 = (0, _preact.h)(RefinementList, _extends({}, this.props, {
+        subItems = (0, _preact.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) {
@@ -92,38 +79,20 @@ var RefinementList = /*#__PURE__*/function (_Component) {
       if (facetValue.count !== undefined) {
         key += "/".concat(facetValue.count);
       }
-      var refinementListItemClassName = (0, _uiComponentsShared.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 = (0, _uiComponentsShared.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 (0, _preact.h)(_RefinementListItem.default, {
         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;
@@ -140,7 +109,7 @@ var RefinementList = /*#__PURE__*/function (_Component) {
         return;
       }
       if (originalEvent.target.tagName === 'INPUT') {
-        this.refine(facetValueToRefine);
+        _this.refine(facetValueToRefine);
         return;
       }
       var parent = originalEvent.target;
@@ -154,7 +123,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 = !(0, _utils.isEqual)(this.props.facetValues, nextProps.facetValues);
+      return areFacetValuesDifferent;
+    }
+  }, {
+    key: "refine",
+    value: function refine(facetValueToRefine) {
+      this.props.toggleRefinement(facetValueToRefine);
     }
   }, {
     key: "componentWillReceiveProps",