instantsearch.js 4.44.1 → 4.46.0

package/cjs/widgets/numeric-menu/defaultTemplates.js

@@ -4,8 +4,27 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
+var _preact = require("preact");
+
+/** @jsx h */
 var defaultTemplates = {
-  item: "<label class=\"{{cssClasses.label}}\">\n  <input type=\"radio\" class=\"{{cssClasses.radio}}\" name=\"{{attribute}}\"{{#isRefined}} checked{{/isRefined}} />\n  <span class=\"{{cssClasses.labelText}}\">{{label}}</span>\n</label>"
+  item: function item(_ref) {
+    var cssClasses = _ref.cssClasses,
+        attribute = _ref.attribute,
+        label = _ref.label,
+        isRefined = _ref.isRefined;
+    return (0, _preact.h)("label", {
+      className: cssClasses.label
+    }, (0, _preact.h)("input", {
+      type: "radio",
+      className: cssClasses.radio,
+      name: attribute,
+      defaultChecked: isRefined
+    }), (0, _preact.h)("span", {
+      className: cssClasses.labelText
+    }, label));
+  }
 };
 var _default = defaultTemplates;
 exports.default = _default;

package/cjs/widgets/range-input/range-input.js

@@ -42,8 +42,12 @@ var withUsage = (0, _index.createDocumentationMessageGenerator)({
 });
 var suit = (0, _suit.component)('RangeInput');
 var defaultTemplates = {
-  separatorText: 'to',
-  submitText: 'Go'
+  separatorText: function separatorText() {
+    return 'to';
+  },
+  submitText: function submitText() {
+    return 'Go';
+  }
 };
 
 var renderer = function renderer(_ref) {

package/cjs/widgets/rating-menu/defaultTemplates.js

@@ -4,8 +4,64 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
+var _preact = require("preact");
+
+var _formatNumber = require("../../lib/formatNumber.js");
+
+var _index = require("../../lib/utils/index.js");
+
+/** @jsx h */
+function ItemWrapper(_ref) {
+  var children = _ref.children,
+      count = _ref.count,
+      value = _ref.value,
+      url = _ref.url,
+      cssClasses = _ref.cssClasses;
+
+  if (count) {
+    return (0, _preact.h)("a", {
+      className: (0, _index.cx)(cssClasses.link),
+      "aria-label": "".concat(value, " & up"),
+      href: url
+    }, children);
+  }
+
+  return (0, _preact.h)("div", {
+    className: (0, _index.cx)(cssClasses.link),
+    "aria-label": "".concat(value, " & up"),
+    disabled: true
+  }, children);
+}
+
 var defaultTemplates = {
-  item: "{{#count}}<a class=\"{{cssClasses.link}}\" aria-label=\"{{value}} & up\" href=\"{{url}}\">{{/count}}{{^count}}<div class=\"{{cssClasses.link}}\" aria-label=\"{{value}} & up\" disabled>{{/count}}\n  {{#stars}}<svg class=\"{{cssClasses.starIcon}} {{#.}}{{cssClasses.fullStarIcon}}{{/.}}{{^.}}{{cssClasses.emptyStarIcon}}{{/.}}\" aria-hidden=\"true\" width=\"24\" height=\"24\">\n    {{#.}}<use xlink:href=\"#ais-RatingMenu-starSymbol\"></use>{{/.}}{{^.}}<use xlink:href=\"#ais-RatingMenu-starEmptySymbol\"></use>{{/.}}\n  </svg>{{/stars}}\n  <span class=\"{{cssClasses.label}}\">& Up</span>\n  {{#count}}<span class=\"{{cssClasses.count}}\">{{#helpers.formatNumber}}{{count}}{{/helpers.formatNumber}}</span>{{/count}}\n{{#count}}</a>{{/count}}{{^count}}</div>{{/count}}"
+  item: function item(_ref2) {
+    var count = _ref2.count,
+        value = _ref2.value,
+        url = _ref2.url,
+        stars = _ref2.stars,
+        cssClasses = _ref2.cssClasses;
+    return (0, _preact.h)(ItemWrapper, {
+      count: count,
+      value: value,
+      url: url,
+      cssClasses: cssClasses
+    }, stars.map(function (isFull, index) {
+      return (0, _preact.h)("svg", {
+        key: index,
+        className: (0, _index.cx)([(0, _index.cx)(cssClasses.starIcon), (0, _index.cx)(isFull ? cssClasses.fullStarIcon : cssClasses.emptyStarIcon)]),
+        "aria-hidden": "true",
+        width: "24",
+        height: "24"
+      }, (0, _preact.h)("use", {
+        xlinkHref: isFull ? '#ais-RatingMenu-starSymbol' : '#ais-RatingMenu-starEmptySymbol'
+      }));
+    }), (0, _preact.h)("span", {
+      className: (0, _index.cx)(cssClasses.label)
+    }, "& Up"), count && (0, _preact.h)("span", {
+      className: (0, _index.cx)(cssClasses.count)
+    }, (0, _formatNumber.formatNumber)(count)));
+  }
 };
 var _default = defaultTemplates;
 exports.default = _default;

package/cjs/widgets/refinement-list/defaultTemplates.js

@@ -4,10 +4,45 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
+var _preact = require("preact");
+
+var _formatNumber = require("../../lib/formatNumber.js");
+
+var _index = require("../../lib/utils/index.js");
+
+/** @jsx h */
 var defaultTemplates = {
-  item: "<label class=\"{{cssClasses.label}}\">\n  <input type=\"checkbox\"\n         class=\"{{cssClasses.checkbox}}\"\n         value=\"{{value}}\"\n         {{#isRefined}}checked{{/isRefined}} />\n  <span class=\"{{cssClasses.labelText}}\">{{#isFromSearch}}{{{highlighted}}}{{/isFromSearch}}{{^isFromSearch}}{{highlighted}}{{/isFromSearch}}</span>\n  <span class=\"{{cssClasses.count}}\">{{#helpers.formatNumber}}{{count}}{{/helpers.formatNumber}}</span>\n</label>",
-  showMoreText: "\n    {{#isShowingMore}}\n      Show less\n    {{/isShowingMore}}\n    {{^isShowingMore}}\n      Show more\n    {{/isShowingMore}}\n    ",
-  searchableNoResults: 'No results'
+  item: function item(_ref) {
+    var cssClasses = _ref.cssClasses,
+        count = _ref.count,
+        value = _ref.value,
+        highlighted = _ref.highlighted,
+        isRefined = _ref.isRefined,
+        isFromSearch = _ref.isFromSearch;
+    return (0, _preact.h)("label", {
+      className: (0, _index.cx)(cssClasses.label)
+    }, (0, _preact.h)("input", {
+      type: "checkbox",
+      className: (0, _index.cx)(cssClasses.checkbox),
+      value: value,
+      defaultChecked: isRefined
+    }), (0, _preact.h)("span", {
+      className: (0, _index.cx)(cssClasses.labelText),
+      dangerouslySetInnerHTML: isFromSearch ? {
+        __html: highlighted
+      } : undefined
+    }, !isFromSearch && highlighted), (0, _preact.h)("span", {
+      className: (0, _index.cx)(cssClasses.count)
+    }, (0, _formatNumber.formatNumber)(count)));
+  },
+  showMoreText: function showMoreText(_ref2) {
+    var isShowingMore = _ref2.isShowingMore;
+    return isShowingMore ? 'Show less' : 'Show more';
+  },
+  searchableNoResults: function searchableNoResults() {
+    return 'No results';
+  }
 };
 var _default = defaultTemplates;
 exports.default = _default;

package/cjs/widgets/relevant-sort/defaultTemplates.js

@@ -5,7 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var defaultTemplates = {
-  text: '',
+  text: function text() {
+    return '';
+  },
   button: function button(_ref) {
     var isRelevantSorted = _ref.isRelevantSorted;
     return isRelevantSorted ? 'See all results' : 'See relevant results';

package/cjs/widgets/search-box/defaultTemplates.js

@@ -4,10 +4,69 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
+var _preact = require("preact");
+
+/** @jsx h */
+var _ref2 = (0, _preact.h)("path", {
+  d: "M8.114 10L.944 2.83 0 1.885 1.886 0l.943.943L10 8.113l7.17-7.17.944-.943L20 1.886l-.943.943-7.17 7.17 7.17 7.17.943.944L18.114 20l-.943-.943-7.17-7.17-7.17 7.17-.944.943L0 18.114l.943-.943L8.113 10z"
+});
+
+var _ref4 = (0, _preact.h)("path", {
+  d: "M26.804 29.01c-2.832 2.34-6.465 3.746-10.426 3.746C7.333 32.756 0 25.424 0 16.378 0 7.333 7.333 0 16.378 0c9.046 0 16.378 7.333 16.378 16.378 0 3.96-1.406 7.594-3.746 10.426l10.534 10.534c.607.607.61 1.59-.004 2.202-.61.61-1.597.61-2.202.004L26.804 29.01zm-10.426.627c7.323 0 13.26-5.936 13.26-13.26 0-7.32-5.937-13.257-13.26-13.257C9.056 3.12 3.12 9.056 3.12 16.378c0 7.323 5.936 13.26 13.258 13.26z"
+});
+
+var _ref6 = (0, _preact.h)("g", {
+  fill: "none",
+  fillRule: "evenodd"
+}, (0, _preact.h)("g", {
+  transform: "translate(1 1)",
+  strokeWidth: "2"
+}, (0, _preact.h)("circle", {
+  strokeOpacity: ".5",
+  cx: "18",
+  cy: "18",
+  r: "18"
+}), (0, _preact.h)("path", {
+  d: "M36 18c0-9.94-8.06-18-18-18"
+}, (0, _preact.h)("animateTransform", {
+  attributeName: "transform",
+  type: "rotate",
+  from: "0 18 18",
+  to: "360 18 18",
+  dur: "1s",
+  repeatCount: "indefinite"
+}))));
+
 var defaultTemplate = {
-  reset: "\n<svg class=\"{{cssClasses.resetIcon}}\" viewBox=\"0 0 20 20\" width=\"10\" height=\"10\">\n  <path d=\"M8.114 10L.944 2.83 0 1.885 1.886 0l.943.943L10 8.113l7.17-7.17.944-.943L20 1.886l-.943.943-7.17 7.17 7.17 7.17.943.944L18.114 20l-.943-.943-7.17-7.17-7.17 7.17-.944.943L0 18.114l.943-.943L8.113 10z\"></path>\n</svg>\n  ",
-  submit: "\n<svg class=\"{{cssClasses.submitIcon}}\" width=\"10\" height=\"10\" viewBox=\"0 0 40 40\">\n  <path d=\"M26.804 29.01c-2.832 2.34-6.465 3.746-10.426 3.746C7.333 32.756 0 25.424 0 16.378 0 7.333 7.333 0 16.378 0c9.046 0 16.378 7.333 16.378 16.378 0 3.96-1.406 7.594-3.746 10.426l10.534 10.534c.607.607.61 1.59-.004 2.202-.61.61-1.597.61-2.202.004L26.804 29.01zm-10.426.627c7.323 0 13.26-5.936 13.26-13.26 0-7.32-5.937-13.257-13.26-13.257C9.056 3.12 3.12 9.056 3.12 16.378c0 7.323 5.936 13.26 13.258 13.26z\"></path>\n</svg>\n  ",
-  loadingIndicator: "\n<svg class=\"{{cssClasses.loadingIcon}}\" width=\"16\" height=\"16\" viewBox=\"0 0 38 38\" stroke=\"#444\">\n  <g fill=\"none\" fillRule=\"evenodd\">\n    <g transform=\"translate(1 1)\" strokeWidth=\"2\">\n      <circle strokeOpacity=\".5\" cx=\"18\" cy=\"18\" r=\"18\" />\n      <path d=\"M36 18c0-9.94-8.06-18-18-18\">\n        <animateTransform\n          attributeName=\"transform\"\n          type=\"rotate\"\n          from=\"0 18 18\"\n          to=\"360 18 18\"\n          dur=\"1s\"\n          repeatCount=\"indefinite\"\n        />\n      </path>\n    </g>\n  </g>\n</svg>\n  "
+  reset: function reset(_ref) {
+    var cssClasses = _ref.cssClasses;
+    return (0, _preact.h)("svg", {
+      className: cssClasses.resetIcon,
+      viewBox: "0 0 20 20",
+      width: "10",
+      height: "10"
+    }, _ref2);
+  },
+  submit: function submit(_ref3) {
+    var cssClasses = _ref3.cssClasses;
+    return (0, _preact.h)("svg", {
+      className: cssClasses.submitIcon,
+      width: "10",
+      height: "10",
+      viewBox: "0 0 40 40"
+    }, _ref4);
+  },
+  loadingIndicator: function loadingIndicator(_ref5) {
+    var cssClasses = _ref5.cssClasses;
+    return (0, _preact.h)("svg", {
+      className: cssClasses.loadingIcon,
+      width: "16",
+      height: "16",
+      viewBox: "0 0 38 38",
+      stroke: "#444"
+    }, _ref6);
+  }
 };
 var _default = defaultTemplate;
 exports.default = _default;

package/cjs/widgets/stats/stats.js

@@ -17,6 +17,8 @@ var _index = require("../../lib/utils/index.js");
 
 var _suit = require("../../lib/suit.js");
 
+var _formatNumber = require("../../lib/formatNumber.js");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
@@ -30,25 +32,71 @@ var withUsage = (0, _index.createDocumentationMessageGenerator)({
 });
 var suit = (0, _suit.component)('Stats');
 var defaultTemplates = {
-  text: "\n    {{#areHitsSorted}}\n      {{#hasNoSortedResults}}No relevant results{{/hasNoSortedResults}}\n      {{#hasOneSortedResults}}1 relevant result{{/hasOneSortedResults}}\n      {{#hasManySortedResults}}{{#helpers.formatNumber}}{{nbSortedHits}}{{/helpers.formatNumber}} relevant results{{/hasManySortedResults}}\n      sorted out of {{#helpers.formatNumber}}{{nbHits}}{{/helpers.formatNumber}}\n    {{/areHitsSorted}}\n    {{^areHitsSorted}}\n      {{#hasNoResults}}No results{{/hasNoResults}}\n      {{#hasOneResult}}1 result{{/hasOneResult}}\n      {{#hasManyResults}}{{#helpers.formatNumber}}{{nbHits}}{{/helpers.formatNumber}} results{{/hasManyResults}}\n    {{/areHitsSorted}}\n    found in {{processingTimeMS}}ms"
+  text: function text(props) {
+    return "".concat(props.areHitsSorted ? getSortedResultsSentence(props) : getResultsSentence(props), " found in ").concat(props.processingTimeMS, "ms");
+  }
 };
 exports.defaultTemplates = defaultTemplates;
 
-var renderer = function renderer(_ref) {
-  var renderState = _ref.renderState,
-      cssClasses = _ref.cssClasses,
-      containerNode = _ref.containerNode,
-      templates = _ref.templates;
-  return function (_ref2, isFirstRendering) {
-    var hitsPerPage = _ref2.hitsPerPage,
-        nbHits = _ref2.nbHits,
-        nbSortedHits = _ref2.nbSortedHits,
-        areHitsSorted = _ref2.areHitsSorted,
-        nbPages = _ref2.nbPages,
-        page = _ref2.page,
-        processingTimeMS = _ref2.processingTimeMS,
-        query = _ref2.query,
-        instantSearchInstance = _ref2.instantSearchInstance;
+function getSortedResultsSentence(_ref) {
+  var nbHits = _ref.nbHits,
+      hasNoSortedResults = _ref.hasNoSortedResults,
+      hasOneSortedResults = _ref.hasOneSortedResults,
+      hasManySortedResults = _ref.hasManySortedResults,
+      nbSortedHits = _ref.nbSortedHits;
+  var suffix = "sorted out of ".concat((0, _formatNumber.formatNumber)(nbHits));
+
+  if (hasNoSortedResults) {
+    return "No relevant results ".concat(suffix);
+  }
+
+  if (hasOneSortedResults) {
+    return "1 relevant result ".concat(suffix);
+  }
+
+  if (hasManySortedResults) {
+    return "".concat((0, _formatNumber.formatNumber)(nbSortedHits || 0), " relevant results ").concat(suffix);
+  }
+
+  return '';
+}
+
+function getResultsSentence(_ref2) {
+  var nbHits = _ref2.nbHits,
+      hasNoResults = _ref2.hasNoResults,
+      hasOneResult = _ref2.hasOneResult,
+      hasManyResults = _ref2.hasManyResults;
+
+  if (hasNoResults) {
+    return 'No results';
+  }
+
+  if (hasOneResult) {
+    return '1 result';
+  }
+
+  if (hasManyResults) {
+    return "".concat((0, _formatNumber.formatNumber)(nbHits), " results");
+  }
+
+  return '';
+}
+
+var renderer = function renderer(_ref3) {
+  var renderState = _ref3.renderState,
+      cssClasses = _ref3.cssClasses,
+      containerNode = _ref3.containerNode,
+      templates = _ref3.templates;
+  return function (_ref4, isFirstRendering) {
+    var hitsPerPage = _ref4.hitsPerPage,
+        nbHits = _ref4.nbHits,
+        nbSortedHits = _ref4.nbSortedHits,
+        areHitsSorted = _ref4.areHitsSorted,
+        nbPages = _ref4.nbPages,
+        page = _ref4.page,
+        processingTimeMS = _ref4.processingTimeMS,
+        query = _ref4.query,
+        instantSearchInstance = _ref4.instantSearchInstance;
 
     if (isFirstRendering) {
       renderState.templateProps = (0, _index.prepareTemplateProps)({
@@ -82,12 +130,12 @@ var renderer = function renderer(_ref) {
 
 
 var stats = function stats(widgetParams) {
-  var _ref3 = widgetParams || {},
-      container = _ref3.container,
-      _ref3$cssClasses = _ref3.cssClasses,
-      userCssClasses = _ref3$cssClasses === void 0 ? {} : _ref3$cssClasses,
-      _ref3$templates = _ref3.templates,
-      templates = _ref3$templates === void 0 ? {} : _ref3$templates;
+  var _ref5 = widgetParams || {},
+      container = _ref5.container,
+      _ref5$cssClasses = _ref5.cssClasses,
+      userCssClasses = _ref5$cssClasses === void 0 ? {} : _ref5$cssClasses,
+      _ref5$templates = _ref5.templates,
+      templates = _ref5$templates === void 0 ? {} : _ref5$templates;
 
   if (!container) {
     throw new Error(withUsage('The `container` option is required.'));

package/cjs/widgets/toggle-refinement/defaultTemplates.js

@@ -5,7 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var defaultTemplates = {
-  labelText: '{{name}}'
+  labelText: function labelText(_ref) {
+    var name = _ref.name;
+    return name;
+  }
 };
 var _default = defaultTemplates;
 exports.default = _default;

package/cjs/widgets/voice-search/defaultTemplates.js

@@ -5,22 +5,94 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var getButtonInnerElement = function getButtonInnerElement(status, errorCode, isListening) {
+var _preact = require("preact");
+
+/** @jsx h */
+var _ref2 = (0, _preact.h)(_preact.Fragment, null, (0, _preact.h)("line", {
+  x1: "1",
+  y1: "1",
+  x2: "23",
+  y2: "23"
+}), (0, _preact.h)("path", {
+  d: "M9 9v3a3 3 0 0 0 5.12 2.12M15 9.34V4a3 3 0 0 0-5.94-.6"
+}), (0, _preact.h)("path", {
+  d: "M17 16.95A7 7 0 0 1 5 12v-2m14 0v2a7 7 0 0 1-.11 1.23"
+}), (0, _preact.h)("line", {
+  x1: "12",
+  y1: "19",
+  x2: "12",
+  y2: "23"
+}), (0, _preact.h)("line", {
+  x1: "8",
+  y1: "23",
+  x2: "16",
+  y2: "23"
+}));
+
+var _ref3 = (0, _preact.h)("path", {
+  d: "M19 10v2a7 7 0 0 1-14 0v-2"
+});
+
+var _ref4 = (0, _preact.h)("line", {
+  x1: "12",
+  y1: "19",
+  x2: "12",
+  y2: "23"
+});
+
+var _ref5 = (0, _preact.h)("line", {
+  x1: "8",
+  y1: "23",
+  x2: "16",
+  y2: "23"
+});
+
+var ButtonInnerElement = function ButtonInnerElement(_ref) {
+  var status = _ref.status,
+      errorCode = _ref.errorCode,
+      isListening = _ref.isListening;
+
   if (status === 'error' && errorCode === 'not-allowed') {
-    return "<line x1=\"1\" y1=\"1\" x2=\"23\" y2=\"23\"></line>\n            <path d=\"M9 9v3a3 3 0 0 0 5.12 2.12M15 9.34V4a3 3 0 0 0-5.94-.6\"></path>\n            <path d=\"M17 16.95A7 7 0 0 1 5 12v-2m14 0v2a7 7 0 0 1-.11 1.23\"></path>\n            <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\"></line>\n            <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\"></line>";
+    return _ref2;
   }
 
-  return "<path\n            d=\"M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z\"\n            fill=\"".concat(isListening ? 'currentColor' : 'none', "\">\n          </path>\n          <path d=\"M19 10v2a7 7 0 0 1-14 0v-2\"></path>\n          <line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"23\"></line>\n          <line x1=\"8\" y1=\"23\" x2=\"16\" y2=\"23\"></line>");
+  return (0, _preact.h)(_preact.Fragment, null, (0, _preact.h)("path", {
+    d: "M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z",
+    fill: isListening ? 'currentColor' : 'none'
+  }), _ref3, _ref4, _ref5);
 };
 
 var defaultTemplates = {
-  buttonText: function buttonText(_ref) {
-    var status = _ref.status,
-        errorCode = _ref.errorCode,
-        isListening = _ref.isListening;
-    return "<svg\n       width=\"16\"\n       height=\"16\"\n       viewBox=\"0 0 24 24\"\n       fill=\"none\"\n       stroke=\"currentColor\"\n       stroke-width=\"2\"\n       stroke-linecap=\"round\"\n       stroke-linejoin=\"round\"\n     >\n       ".concat(getButtonInnerElement(status, errorCode, isListening), "\n     </svg>");
+  buttonText: function buttonText(_ref6) {
+    var status = _ref6.status,
+        errorCode = _ref6.errorCode,
+        isListening = _ref6.isListening;
+    return (0, _preact.h)("svg", {
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor"
+      /* eslint-disable react/no-unknown-property */
+      // Preact supports kebab case attributes, and using camel case would
+      // require using `preact/compat`.
+      // @TODO: reconsider using the `react` ESLint preset
+      ,
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+      /* eslint-enable react/no-unknown-property */
+
+    }, (0, _preact.h)(ButtonInnerElement, {
+      status: status,
+      errorCode: errorCode,
+      isListening: isListening
+    }));
   },
-  status: "<p>{{transcript}}</p>"
+  status: function status(_ref7) {
+    var transcript = _ref7.transcript;
+    return (0, _preact.h)("p", null, transcript);
+  }
 };
 var _default = defaultTemplates;
 exports.default = _default;