@nosto/search-js 2.11.1 → 2.12.1

package/dist/preact/autocomplete.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../index.es-DlUp67LT.cjs"),a=require("preact"),u=require("../renderHeadless-xhkLegO4.cjs"),i=require("../jsxRuntime.module-B3sGoTIU.cjs"),r=require("../configContext-BR7w4VlU.cjs"),c=require("../baseConfig-BFFqFSg5.cjs");function f(e){return e!==null&&typeof e=="object"&&"props"in e&&typeof e.type=="string"}function m({children:e,hit:n}){var o;if(!f(e))throw new Error("AutocompleteElement expects a single valid HTML element as its child (e.g., <div>, <a>). Custom components are not supported.");const t=(o=e.props)==null?void 0:o.onClick;return a.cloneElement(e,{onClick:p=>{n&&l.s(s=>s.recordSearchClick("autocomplete",n)),typeof t=="function"&&t(p)}})}function g({children:e,onSearchInput:n}){return u.renderHeadless({children:e,updateElement:t=>(!u.isHTMLInput(t)||t.props.type!=="search"||(t.props={...t.props,onInput:o=>{o.target instanceof HTMLInputElement&&n(o.target)}}),t)})}const C={...c.defaultBaseConfig};function d(e){return{pageType:"autocomplete",...C,...e}}function S({config:e,store:n,children:t}){const o=n??r.createStore();return c.useCheckClientScript(),i.u(r.ConfigContext,{value:d(e),children:i.u(r.StoreContext,{value:o,children:t})})}exports.AutocompleteElement=m;exports.AutocompletePageProvider=S;exports.SearchInput=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../index.es-DlUp67LT.cjs"),a=require("preact"),i=require("../jsxRuntime.module-B3sGoTIU.cjs"),c=require("../configContext-BR7w4VlU.cjs"),p=require("../baseConfig-BFFqFSg5.cjs");function m(e){return e!==null&&typeof e=="object"&&"props"in e&&typeof e.type=="string"}function f({children:e,hit:t}){var n;if(!m(e))throw new Error("AutocompleteElement expects a single valid HTML element as its child (e.g., <div>, <a>). Custom components are not supported.");const o=(n=e.props)==null?void 0:n.onClick;return a.cloneElement(e,{onClick:r=>{t&&s.s(u=>u.recordSearchClick("autocomplete",t)),typeof o=="function"&&o(r)}})}function C({as:e,componentProps:t,onSearchInput:o,children:n}){const r={...t,onInput:l=>{o(l.target)}},u=e??"input";return e||(r.type="search"),i.u(u,{...r,children:n})}const g={...p.defaultBaseConfig};function d(e){return{pageType:"autocomplete",...g,...e}}function S({config:e,store:t,children:o}){const n=t??c.createStore();return p.useCheckClientScript(),i.u(c.ConfigContext,{value:d(e),children:i.u(c.StoreContext,{value:n,children:o})})}exports.AutocompleteElement=f;exports.AutocompletePageProvider=S;exports.SearchInput=C;

package/dist/preact/autocomplete.es.js

@@ -1,52 +1,49 @@
-import { s as u } from "../index.es-B8mbAxS4.js";
+import { s as c } from "../index.es-B8mbAxS4.js";
 import { cloneElement as a } from "preact";
-import { r as s, i as c } from "../renderHeadless-BteGML1G.js";
-import { u as n } from "../jsxRuntime.module-Bzuv3cXw.js";
-import { c as l, S as m, C as f } from "../configContext-GuZOIX3o.js";
-import { d as C, u as g } from "../baseConfig-Bafl02NY.js";
-function E(t) {
+import { u as i } from "../jsxRuntime.module-Bzuv3cXw.js";
+import { c as m, S as l, C as s } from "../configContext-GuZOIX3o.js";
+import { d as f, u as C } from "../baseConfig-Bafl02NY.js";
+function g(t) {
   return t !== null && typeof t == "object" && "props" in t && typeof t.type == "string";
 }
-function I({ children: t, hit: r }) {
-  var o;
-  if (!E(t))
+function x({ children: t, hit: e }) {
+  var n;
+  if (!g(t))
     throw new Error(
       "AutocompleteElement expects a single valid HTML element as its child (e.g., <div>, <a>). Custom components are not supported."
     );
-  const e = (o = t.props) == null ? void 0 : o.onClick;
+  const o = (n = t.props) == null ? void 0 : n.onClick;
   return a(t, {
-    onClick: (p) => {
-      r && u((i) => i.recordSearchClick("autocomplete", r)), typeof e == "function" && e(p);
+    onClick: (r) => {
+      e && c((p) => p.recordSearchClick("autocomplete", e)), typeof o == "function" && o(r);
     }
   });
 }
-function L({ children: t, onSearchInput: r }) {
-  return s({
-    children: t,
-    updateElement: (e) => (!c(e) || e.props.type !== "search" || (e.props = {
-      ...e.props,
-      onInput: (o) => {
-        o.target instanceof HTMLInputElement && r(o.target);
-      }
-    }), e)
-  });
+function P({ as: t, componentProps: e, onSearchInput: o, children: n }) {
+  const r = {
+    ...e,
+    onInput: (u) => {
+      o(u.target);
+    }
+  }, p = t ?? "input";
+  return t || (r.type = "search"), /* @__PURE__ */ i(p, { ...r, children: n });
 }
-const S = {
-  ...C
+const d = {
+  ...f
 };
-function k(t) {
+function S(t) {
   return {
     pageType: "autocomplete",
-    ...S,
+    ...d,
     ...t
   };
 }
-function M({ config: t, store: r, children: e }) {
-  const o = r ?? l();
-  return g(), /* @__PURE__ */ n(f, { value: k(t), children: /* @__PURE__ */ n(m, { value: o, children: e }) });
+function T({ config: t, store: e, children: o }) {
+  const n = e ?? m();
+  return C(), /* @__PURE__ */ i(s, { value: S(t), children: /* @__PURE__ */ i(l, { value: n, children: o }) });
 }
 export {
-  I as AutocompleteElement,
-  M as AutocompletePageProvider,
-  L as SearchInput
+  x as AutocompleteElement,
+  T as AutocompletePageProvider,
+  P as SearchInput
 };

package/dist/preact/hooks.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("../useLoadMore-BFEnHdOH.cjs"),z=require("../logger-BcHMZObS.cjs"),m=require("preact/hooks"),P=require("../index.es-DlUp67LT.cjs"),N=require("../parseNumber-FsZ8w61u.cjs");function T(e){const r=S.useNostoAppState(t=>t.response);return e&&Array.isArray(e)||e&&z.isPlainObject(e)?e:r}function q(e){var c;const r=((c=e.data)==null?void 0:c.filter(u=>u.selected).length)??0,[t,n]=m.useState(r>0),{toggleProductFilter:o}=S.useActions();return{active:t,selectedFiltersCount:r,toggleActive:()=>{n(!t)},toggleProductFilter:o}}function L(){const{loading:e,facets:r}=S.useNostoAppState(t=>{var n,o;return{loading:t.loading,facets:((o=(n=t.response)==null?void 0:n.products)==null?void 0:o.facets)??[]}});return{loading:e,facets:r}}function O(e,r){const t=r-e;return!isNaN(t)&&t>0?new Array(r-e).fill(void 0).map((n,o)=>o+e):[]}function j(e){const{query:r,products:t}=S.useNostoAppState(n=>({query:n.query,products:n.response.products}));return m.useMemo(()=>{var F,y,R;if(!t)return{totalPages:0,resultsFrom:0,resultsTo:0,pages:[]};const n=((F=r.products)==null?void 0:F.from)??0,o=(e==null?void 0:e.width)??1/0,l=Math.max(Math.floor(o-1)/2,1),c=t.size>0?Math.floor(n/t.size)+1:1,u=t.size>0?Math.ceil(t.total/t.size):0,g=A=>A>=c-l&&A<=c+l,s=n+1,a=Math.min(n+t.total,t.total),i={from:n,page:c,current:!0},d=A=>({from:(A-1)*t.size,page:A,current:A===c}),h=c>1?d(c-1):void 0,f=c<u?d(c+1):void 0,b=c-l-1>1?d(1):void 0,p=c+l+1<u?d(u):void 0,v=O(1,u+1).filter(g).map(d);return!b&&((y=v[0])==null?void 0:y.page)===2&&v.unshift(d(1)),!p&&((R=v[v.length-1])==null?void 0:R.page)===u-1&&v.push(d(u)),{totalPages:u,resultsFrom:s,resultsTo:a,current:i,prev:h,next:f,first:b,last:p,pages:v}},[r,t,e==null?void 0:e.width])}function V(){const[e,r]=m.useState([]),[t,n]=m.useState([]);return m.useEffect(()=>{P.s(async o=>{const{products:l,segments:c}=await o.getSearchSessionParams();r(c??[]),n((l==null?void 0:l.personalizationBoost)??[])})},[]),{segments:e,boost:t}}function B(){const{facets:e}=S.useNostoAppState(s=>{var a;return{facets:((a=s.response.products)==null?void 0:a.facets)??[]}}),{replaceFilter:r,toggleProductFilter:t}=S.useActions(),n=m.useCallback(s=>{const a=e==null?void 0:e.find(i=>i.type==="stats"&&i.field===s);if(a&&"min"in a&&"max"in a)return a},[e]),o=m.useCallback(s=>{var a;return((a=e==null?void 0:e.find(i=>i.field===s))==null?void 0:a.name)??s},[e]),l=m.useCallback(s=>"field"in s&&(s.value instanceof Array||s.range instanceof Array),[]),c=m.useCallback(s=>{var a;return{...s,range:(a=s.range)==null?void 0:a.map(i=>({gt:i.gt?Number(i.gt):i.gt,gte:i.gte?Number(i.gte):i.gte,lt:i.lt?Number(i.lt):i.lt,lte:i.lte?Number(i.lte):i.lte}))}},[]),u=m.useCallback(s=>(s.value??[]).map(i=>({value:i,field:s.field,name:o(s.field),filter:c(s),remove:()=>{t(s.field,i,!1)}})),[c,o,t]),g=m.useCallback(s=>(s.range??[]).map(i=>{var f,b;const d=i.gte??i.gt??((f=n(s.field))==null?void 0:f.min),h=i.lte??i.lt??((b=n(s.field))==null?void 0:b.max);if(d!==void 0&&h!==void 0)return{value:`${d} - ${h}`,field:s.field,name:o(s.field),filter:c(s),remove:()=>{r(s.field,void 0)}}}).filter(Boolean),[c,n,o,r]);return{selectFilters:l,toValueFilter:u,toRangeFilter:g}}function C(){const{filter:e}=S.useNostoAppState(u=>{var g;return{filter:((g=u.query.products)==null?void 0:g.filter)??[]}}),{updateSearch:r}=S.useActions(),{selectFilters:t,toValueFilter:n,toRangeFilter:o}=B(),l=m.useMemo(()=>e?e.filter(t).flatMap(u=>"value"in u?n(u):"range"in u?o(u):[]).filter(Boolean):[],[e,t,o,n]),c=m.useCallback(()=>{r({products:{filter:[]}})},[r]);return{filters:l,removeAll:c}}function k(e){var i,d,h;const{replaceFilter:r}=S.useActions(),{query:t,products:n}=S.useNostoAppState(f=>({query:f.query,products:f.response.products})),o=(i=n==null?void 0:n.facets)==null?void 0:i.find(f=>f.id===e);if(!o)return{min:0,max:0,range:[0,0],updateRange:()=>{}};const l=(h=(d=t.products)==null?void 0:d.filter)==null?void 0:h.find(f=>f.field===o.field),c=l!=null&&l.range?l.range[0]:void 0,u=typeof c=="object"&&("gte"in c||"lte"in c)?[N.parseNumber(c.gte),N.parseNumber(c.lte)]:[void 0,void 0],g="min"in o?Math.floor(o.min):0,s="max"in o?Math.ceil(o.max):0,a=([f,b])=>{const p=f!==void 0?Math.floor(f):void 0,v=b!==void 0?Math.ceil(b):void 0,F=p!==void 0,y=v!==void 0;(g===p||!F)&&(s===v||!y)?r(o.field,void 0):(g===p||!F)&&y?r(o.field,{lte:v.toString()}):(s===v||!y)&&F?r(o.field,{gte:p.toString()}):F&&y&&r(o.field,{gte:p.toString(),lte:v.toString()})};return{min:g,max:s,range:[u[0]??g,u[1]??s],updateRange:a}}function D(e,r){const{min:t,max:n,range:o,updateRange:l}=k(e),{filters:c}=C(),u=m.useMemo(()=>{var b;const i=c.find(p=>{var v;return(v=p==null?void 0:p.filter)==null?void 0:v.range});let d=null;if(i){const p=(b=i.filter.range)==null?void 0:b[0];d=[N.parseNumber(p==null?void 0:p.gte),N.parseNumber(p==null?void 0:p.lte)]}const h=[];let f=Math.floor(t/r)*r;for(;f<n;){const p=f+r,v=d&&d[0]===f&&d[1]===p;h.push({min:f,max:p,selected:v}),f=p}return h},[c,t,n,r]),g=i=>{l([i,o[1]])},s=i=>{l([o[0],i])},a=t!==o[0]||n!==o[1];return{min:t,max:n,range:o,updateRange:l,ranges:u,handleMinChange:g,handleMaxChange:s,isSelected:a}}function U(){const{products:e,keywords:r}=S.useNostoAppState(t=>t.response);return{products:e??{hits:[],total:0},keywords:r??{hits:[],total:0}}}function E(){const e=S.useNostoAppState(t=>{var n;return(n=t.query.products)==null?void 0:n.filter});return m.useMemo(()=>e?e.reduce((t,n)=>t+(Array.isArray(n.value)?n.value.length:1),0):0,[e])}function M(e){return e&&!Number.isNaN(e)?e:0}function _(e,r){const{from:t,size:n,total:o}=S.useNostoAppState(s=>{var a,i,d,h,f;return{from:M(((a=s.query.products)==null?void 0:a.from)??0),size:M(((d=(i=s.response)==null?void 0:i.products)==null?void 0:d.size)??0),total:M(((f=(h=s.response)==null?void 0:h.products)==null?void 0:f.total)??0)}}),{updateSearch:l}=S.useActions(),c=t+n,u=[...e].reverse().filter(s=>s+r<o);return{from:t,to:c,total:o,size:n,sizeOptions:u,handleSizeChange:s=>{l({products:{size:N.parseNumber(s)}})}}}function $(e,r){return e.length!==r.length?!1:e.every(t=>r.find(n=>t.field===n.field&&t.order===n.order))}function I(e){var l,c;const r=S.useNostoAppState(u=>u.query),{updateSearch:t}=S.useActions();return{activeSort:((l=e.find(u=>{var g;return $(u.value.sort,((g=r.products)==null?void 0:g.sort)||[])}))==null?void 0:l.id)??((c=e[0])==null?void 0:c.id),setSort:u=>{const g=e.find(s=>s.id===u);g&&t({products:{sort:g.value.sort}})}}}const w=window.SpeechRecognition||window.webkitSpeechRecognition,x=!!(w&&typeof w=="function");function G(){return{listening:!1,startListening:()=>{},stopListening:()=>{}}}function H({language:e="en-US",interimResults:r=!1}={}){const[t,n]=m.useState(!1),o=m.useRef(null),l=m.useCallback(({onResult:u,onError:g})=>{const s=new w;s.lang=e,s.interimResults=r,s.onstart=()=>n(!0),s.onresult=a=>{var d,h;const{transcript:i}=(h=(d=a.results)==null?void 0:d[0])==null?void 0:h[0];u(i)},g&&(s.onerror=a=>g(a.error)),s.onend=()=>n(!1),o.current=s,s.start()},[e,r]),c=m.useCallback(()=>{var u;(u=o.current)==null||u.stop()},[o]);return{listening:t,startListening:l,stopListening:c}}const J=x?H:G;function K(e,r){if(!e.length||!r.length)return[];const t=r.reduce((n,o)=>(n[o]={},n),{});return e.forEach(n=>{var o;(o=n.customFields)==null||o.forEach(({key:l,value:c})=>{const u=l.toLowerCase();r.includes(u)&&(t[u][c]=t[u][c]||[],t[u][c].push(n))})}),Object.entries(t).map(([n,o])=>({field:n,options:Object.entries(o).map(([l,c])=>({value:l,skus:c,unavailable:!1,selected:!1}))}))}function Q(e,r){return e.length?e.map(({field:t,options:n})=>({field:t,options:n.map(o=>{var u;const l=!((u=o.skus)!=null&&u.some(g=>Object.entries(r).every(([s,a])=>{var d,h;return s===t?!0:((h=(d=g.customFields)==null?void 0:d.find(f=>f.key.toLowerCase()===s))==null?void 0:h.value)===a}))),c=r[t]===o.value;return{...o,unavailable:l,selected:c}})})):[]}function W(e=[],r=[]){const[t,n]=m.useState({}),o=m.useMemo(()=>Q(K(e,r),t),[e,r,t]),l=m.useCallback((u,g)=>{n(s=>{const a={...s};return a[u]===g?delete a[u]:a[u]=g,a})},[]),c=m.useMemo(()=>Object.keys(t).filter(s=>t[s]).length===0?[]:o.filter(({field:s})=>t[s]).map(({field:s,options:a})=>{const i=t[s],d=a.find(h=>h.value===i);return(d==null?void 0:d.skus)??[]}).reduce((s,a)=>s.filter(i=>a.includes(i))),[o,t]);return{swatches:o,toggleOption:l,matchedSkus:c}}exports.useActions=S.useActions;exports.useLoadMore=S.useLoadMore;exports.useNostoAppState=S.useNostoAppState;exports.speechToTextSupported=x;exports.useDecoratedSearchResults=T;exports.useFacet=q;exports.useFacets=L;exports.usePagination=j;exports.usePersonalization=V;exports.useProductFilters=C;exports.useRange=k;exports.useRangeSelector=D;exports.useResponse=U;exports.useSelectedFiltersCount=E;exports.useSizeOptions=_;exports.useSort=I;exports.useSpeechToText=J;exports.useSwatches=W;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("../useLoadMore-BFEnHdOH.cjs"),z=require("../logger-BcHMZObS.cjs"),p=require("preact/hooks"),P=require("../index.es-DlUp67LT.cjs"),N=require("../parseNumber-FsZ8w61u.cjs");function T(e){const r=S.useNostoAppState(s=>s.response);return e&&Array.isArray(e)||e&&z.isPlainObject(e)?e:r}function q(e,r){var d;const s=((d=e.data)==null?void 0:d.filter(t=>t.selected).length)??0,{active:o}={active:s>0,...r},[n,l]=p.useState(o),{toggleProductFilter:c}=S.useActions(),u=p.useCallback(()=>{l(!n)},[n]);return{active:n,selectedFiltersCount:s,toggleActive:u,toggleProductFilter:c}}function L(){const{loading:e,facets:r}=S.useNostoAppState(s=>{var o,n;return{loading:s.loading,facets:((n=(o=s.response)==null?void 0:o.products)==null?void 0:n.facets)??[]}});return{loading:e,facets:r}}function O(e,r){const s=r-e;return!isNaN(s)&&s>0?new Array(r-e).fill(void 0).map((o,n)=>n+e):[]}function j(e){const{query:r,products:s}=S.useNostoAppState(o=>({query:o.query,products:o.response.products}));return p.useMemo(()=>{var F,y,R;if(!s)return{totalPages:0,resultsFrom:0,resultsTo:0,pages:[]};const o=((F=r.products)==null?void 0:F.from)??0,n=(e==null?void 0:e.width)??1/0,l=Math.max(Math.floor(n-1)/2,1),c=s.size>0?Math.floor(o/s.size)+1:1,u=s.size>0?Math.ceil(s.total/s.size):0,d=A=>A>=c-l&&A<=c+l,t=o+1,a=Math.min(o+s.total,s.total),i={from:o,page:c,current:!0},f=A=>({from:(A-1)*s.size,page:A,current:A===c}),h=c>1?f(c-1):void 0,g=c<u?f(c+1):void 0,b=c-l-1>1?f(1):void 0,m=c+l+1<u?f(u):void 0,v=O(1,u+1).filter(d).map(f);return!b&&((y=v[0])==null?void 0:y.page)===2&&v.unshift(f(1)),!m&&((R=v[v.length-1])==null?void 0:R.page)===u-1&&v.push(f(u)),{totalPages:u,resultsFrom:t,resultsTo:a,current:i,prev:h,next:g,first:b,last:m,pages:v}},[r,s,e==null?void 0:e.width])}function V(){const[e,r]=p.useState([]),[s,o]=p.useState([]);return p.useEffect(()=>{P.s(async n=>{const{products:l,segments:c}=await n.getSearchSessionParams();r(c??[]),o((l==null?void 0:l.personalizationBoost)??[])})},[]),{segments:e,boost:s}}function B(){const{facets:e}=S.useNostoAppState(t=>{var a;return{facets:((a=t.response.products)==null?void 0:a.facets)??[]}}),{replaceFilter:r,toggleProductFilter:s}=S.useActions(),o=p.useCallback(t=>{const a=e==null?void 0:e.find(i=>i.type==="stats"&&i.field===t);if(a&&"min"in a&&"max"in a)return a},[e]),n=p.useCallback(t=>{var a;return((a=e==null?void 0:e.find(i=>i.field===t))==null?void 0:a.name)??t},[e]),l=p.useCallback(t=>"field"in t&&(t.value instanceof Array||t.range instanceof Array),[]),c=p.useCallback(t=>{var a;return{...t,range:(a=t.range)==null?void 0:a.map(i=>({gt:i.gt?Number(i.gt):i.gt,gte:i.gte?Number(i.gte):i.gte,lt:i.lt?Number(i.lt):i.lt,lte:i.lte?Number(i.lte):i.lte}))}},[]),u=p.useCallback(t=>(t.value??[]).map(i=>({value:i,field:t.field,name:n(t.field),filter:c(t),remove:()=>{s(t.field,i,!1)}})),[c,n,s]),d=p.useCallback(t=>(t.range??[]).map(i=>{var g,b;const f=i.gte??i.gt??((g=o(t.field))==null?void 0:g.min),h=i.lte??i.lt??((b=o(t.field))==null?void 0:b.max);if(f!==void 0&&h!==void 0)return{value:`${f} - ${h}`,field:t.field,name:n(t.field),filter:c(t),remove:()=>{r(t.field,void 0)}}}).filter(Boolean),[c,o,n,r]);return{selectFilters:l,toValueFilter:u,toRangeFilter:d}}function C(){const{filter:e}=S.useNostoAppState(u=>{var d;return{filter:((d=u.query.products)==null?void 0:d.filter)??[]}}),{updateSearch:r}=S.useActions(),{selectFilters:s,toValueFilter:o,toRangeFilter:n}=B(),l=p.useMemo(()=>e?e.filter(s).flatMap(u=>"value"in u?o(u):"range"in u?n(u):[]).filter(Boolean):[],[e,s,n,o]),c=p.useCallback(()=>{r({products:{filter:[]}})},[r]);return{filters:l,removeAll:c}}function k(e){var i,f,h;const{replaceFilter:r}=S.useActions(),{query:s,products:o}=S.useNostoAppState(g=>({query:g.query,products:g.response.products})),n=(i=o==null?void 0:o.facets)==null?void 0:i.find(g=>g.id===e);if(!n)return{min:0,max:0,range:[0,0],updateRange:()=>{}};const l=(h=(f=s.products)==null?void 0:f.filter)==null?void 0:h.find(g=>g.field===n.field),c=l!=null&&l.range?l.range[0]:void 0,u=typeof c=="object"&&("gte"in c||"lte"in c)?[N.parseNumber(c.gte),N.parseNumber(c.lte)]:[void 0,void 0],d="min"in n?Math.floor(n.min):0,t="max"in n?Math.ceil(n.max):0,a=([g,b])=>{const m=g!==void 0?Math.floor(g):void 0,v=b!==void 0?Math.ceil(b):void 0,F=m!==void 0,y=v!==void 0;(d===m||!F)&&(t===v||!y)?r(n.field,void 0):(d===m||!F)&&y?r(n.field,{lte:v.toString()}):(t===v||!y)&&F?r(n.field,{gte:m.toString()}):F&&y&&r(n.field,{gte:m.toString(),lte:v.toString()})};return{min:d,max:t,range:[u[0]??d,u[1]??t],updateRange:a}}function D(e,r){const{min:s,max:o,range:n,updateRange:l}=k(e),{filters:c}=C(),u=p.useMemo(()=>{var b;const i=c.find(m=>{var v;return(v=m==null?void 0:m.filter)==null?void 0:v.range});let f=null;if(i){const m=(b=i.filter.range)==null?void 0:b[0];f=[N.parseNumber(m==null?void 0:m.gte),N.parseNumber(m==null?void 0:m.lte)]}const h=[];let g=Math.floor(s/r)*r;for(;g<o;){const m=g+r,v=f&&f[0]===g&&f[1]===m;h.push({min:g,max:m,selected:v}),g=m}return h},[c,s,o,r]),d=i=>{l([i,n[1]])},t=i=>{l([n[0],i])},a=s!==n[0]||o!==n[1];return{min:s,max:o,range:n,updateRange:l,ranges:u,handleMinChange:d,handleMaxChange:t,isSelected:a}}function U(){const{products:e,keywords:r}=S.useNostoAppState(s=>s.response);return{products:e??{hits:[],total:0},keywords:r??{hits:[],total:0}}}function E(){const e=S.useNostoAppState(s=>{var o;return(o=s.query.products)==null?void 0:o.filter});return p.useMemo(()=>e?e.reduce((s,o)=>s+(Array.isArray(o.value)?o.value.length:1),0):0,[e])}function M(e){return e&&!Number.isNaN(e)?e:0}function _(e,r){const{from:s,size:o,total:n}=S.useNostoAppState(t=>{var a,i,f,h,g;return{from:M(((a=t.query.products)==null?void 0:a.from)??0),size:M(((f=(i=t.response)==null?void 0:i.products)==null?void 0:f.size)??0),total:M(((g=(h=t.response)==null?void 0:h.products)==null?void 0:g.total)??0)}}),{updateSearch:l}=S.useActions(),c=s+o,u=[...e].reverse().filter(t=>t+r<n);return{from:s,to:c,total:n,size:o,sizeOptions:u,handleSizeChange:t=>{l({products:{size:N.parseNumber(t)}})}}}function $(e,r){return e.length!==r.length?!1:e.every(s=>r.find(o=>s.field===o.field&&s.order===o.order))}function I(e){var l,c;const r=S.useNostoAppState(u=>u.query),{updateSearch:s}=S.useActions();return{activeSort:((l=e.find(u=>{var d;return $(u.value.sort,((d=r.products)==null?void 0:d.sort)||[])}))==null?void 0:l.id)??((c=e[0])==null?void 0:c.id),setSort:u=>{const d=e.find(t=>t.id===u);d&&s({products:{sort:d.value.sort}})}}}const w=window.SpeechRecognition||window.webkitSpeechRecognition,x=!!(w&&typeof w=="function");function G(){return{listening:!1,startListening:()=>{},stopListening:()=>{}}}function H({language:e="en-US",interimResults:r=!1}={}){const[s,o]=p.useState(!1),n=p.useRef(null),l=p.useCallback(({onResult:u,onError:d})=>{const t=new w;t.lang=e,t.interimResults=r,t.onstart=()=>o(!0),t.onresult=a=>{var f,h;const{transcript:i}=(h=(f=a.results)==null?void 0:f[0])==null?void 0:h[0];u(i)},d&&(t.onerror=a=>d(a.error)),t.onend=()=>o(!1),n.current=t,t.start()},[e,r]),c=p.useCallback(()=>{var u;(u=n.current)==null||u.stop()},[n]);return{listening:s,startListening:l,stopListening:c}}const J=x?H:G;function K(e,r){if(!e.length||!r.length)return[];const s=r.reduce((o,n)=>(o[n]={},o),{});return e.forEach(o=>{var n;(n=o.customFields)==null||n.forEach(({key:l,value:c})=>{const u=l.toLowerCase();r.includes(u)&&(s[u][c]=s[u][c]||[],s[u][c].push(o))})}),Object.entries(s).map(([o,n])=>({field:o,options:Object.entries(n).map(([l,c])=>({value:l,skus:c,unavailable:!1,selected:!1}))}))}function Q(e,r){return e.length?e.map(({field:s,options:o})=>({field:s,options:o.map(n=>{var u;const l=!((u=n.skus)!=null&&u.some(d=>Object.entries(r).every(([t,a])=>{var f,h;return t===s?!0:((h=(f=d.customFields)==null?void 0:f.find(g=>g.key.toLowerCase()===t))==null?void 0:h.value)===a}))),c=r[s]===n.value;return{...n,unavailable:l,selected:c}})})):[]}function W(e=[],r=[]){const[s,o]=p.useState({}),n=p.useMemo(()=>Q(K(e,r),s),[e,r,s]),l=p.useCallback((u,d)=>{o(t=>{const a={...t};return a[u]===d?delete a[u]:a[u]=d,a})},[]),c=p.useMemo(()=>Object.keys(s).filter(t=>s[t]).length===0?[]:n.filter(({field:t})=>s[t]).map(({field:t,options:a})=>{const i=s[t],f=a.find(h=>h.value===i);return(f==null?void 0:f.skus)??[]}).reduce((t,a)=>t.filter(i=>a.includes(i))),[n,s]);return{swatches:n,toggleOption:l,matchedSkus:c}}exports.useActions=S.useActions;exports.useLoadMore=S.useLoadMore;exports.useNostoAppState=S.useNostoAppState;exports.speechToTextSupported=x;exports.useDecoratedSearchResults=T;exports.useFacet=q;exports.useFacets=L;exports.usePagination=j;exports.usePersonalization=V;exports.useProductFilters=C;exports.useRange=k;exports.useRangeSelector=D;exports.useResponse=U;exports.useSelectedFiltersCount=E;exports.useSizeOptions=_;exports.useSort=I;exports.useSpeechToText=J;exports.useSwatches=W;

package/dist/preact/hooks.d.ts

@@ -1,7 +1,7 @@
 /** @module preact/hooks */
 export { useActions } from './src/hooks/useActions';
 export { useDecoratedSearchResults } from './src/hooks/useDecoratedSearchResults';
-export { useFacet } from './src/hooks/useFacet';
+export { useFacet, type UseFacetOptions } from './src/hooks/useFacet';
 export { useFacets } from './src/hooks/useFacets';
 export { useLoadMore } from './src/hooks/useLoadMore/useLoadMore';
 export { useNostoAppState } from './src/hooks/useNostoAppState';

package/dist/preact/hooks.es.js

@@ -1,35 +1,38 @@
 import { a as y, c as x } from "../useLoadMore-jrN1VGDU.js";
-import { b as ae } from "../useLoadMore-jrN1VGDU.js";
+import { b as ue } from "../useLoadMore-jrN1VGDU.js";
 import { a as T } from "../logger-DVwg4Wor.js";
-import { useState as M, useMemo as b, useEffect as C, useCallback as S, useRef as q } from "preact/hooks";
+import { useState as M, useCallback as S, useMemo as b, useEffect as C, useRef as q } from "preact/hooks";
 import { s as L } from "../index.es-B8mbAxS4.js";
 import { p as z } from "../parseNumber-QA48nJLp.js";
 function Q(e) {
-  const o = y((t) => t.response);
+  const o = y((n) => n.response);
   return e && Array.isArray(e) || e && T(e) ? e : o;
 }
-function W(e) {
-  var i;
-  const o = ((i = e.data) == null ? void 0 : i.filter((c) => c.selected).length) ?? 0, [t, r] = M(o > 0), { toggleProductFilter: s } = x();
+function W(e, o) {
+  var d;
+  const n = ((d = e.data) == null ? void 0 : d.filter((t) => t.selected).length) ?? 0, { active: s } = {
+    active: n > 0,
+    ...o
+  }, [r, l] = M(s), { toggleProductFilter: i } = x(), c = S(() => {
+    l(!r);
+  }, [r]);
   return {
     /** Active value */
-    active: t,
+    active: r,
     /** Selected filters count */
-    selectedFiltersCount: o,
+    selectedFiltersCount: n,
     /** Toggle active function */
-    toggleActive: () => {
-      r(!t);
-    },
+    toggleActive: c,
     /** Toggle product filter function */
-    toggleProductFilter: s
+    toggleProductFilter: i
   };
 }
 function X() {
-  const { loading: e, facets: o } = y((t) => {
-    var r, s;
+  const { loading: e, facets: o } = y((n) => {
+    var s, r;
     return {
-      loading: t.loading,
-      facets: ((s = (r = t.response) == null ? void 0 : r.products) == null ? void 0 : s.facets) ?? []
+      loading: n.loading,
+      facets: ((r = (s = n.response) == null ? void 0 : s.products) == null ? void 0 : r.facets) ?? []
     };
   });
   return {
@@ -40,128 +43,128 @@ function X() {
   };
 }
 function k(e, o) {
-  const t = o - e;
-  return !isNaN(t) && t > 0 ? new Array(o - e).fill(void 0).map((r, s) => s + e) : [];
+  const n = o - e;
+  return !isNaN(n) && n > 0 ? new Array(o - e).fill(void 0).map((s, r) => r + e) : [];
 }
 function Y(e) {
-  const { query: o, products: t } = y((r) => ({
-    query: r.query,
-    products: r.response.products
+  const { query: o, products: n } = y((s) => ({
+    query: s.query,
+    products: s.response.products
   }));
   return b(() => {
     var F, w, N;
-    if (!t)
+    if (!n)
       return {
         totalPages: 0,
         resultsFrom: 0,
         resultsTo: 0,
         pages: []
       };
-    const r = ((F = o.products) == null ? void 0 : F.from) ?? 0, s = (e == null ? void 0 : e.width) ?? 1 / 0, l = Math.max(Math.floor(s - 1) / 2, 1), i = t.size > 0 ? Math.floor(r / t.size) + 1 : 1, c = t.size > 0 ? Math.ceil(t.total / t.size) : 0, f = (R) => R >= i - l && R <= i + l, n = r + 1, a = Math.min(r + t.total, t.total), u = {
-      from: r,
+    const s = ((F = o.products) == null ? void 0 : F.from) ?? 0, r = (e == null ? void 0 : e.width) ?? 1 / 0, l = Math.max(Math.floor(r - 1) / 2, 1), i = n.size > 0 ? Math.floor(s / n.size) + 1 : 1, c = n.size > 0 ? Math.ceil(n.total / n.size) : 0, d = (R) => R >= i - l && R <= i + l, t = s + 1, u = Math.min(s + n.total, n.total), a = {
+      from: s,
       page: i,
       current: !0
-    }, d = (R) => ({
-      from: (R - 1) * t.size,
+    }, f = (R) => ({
+      from: (R - 1) * n.size,
       page: R,
       current: R === i
-    }), p = i > 1 ? d(i - 1) : void 0, g = i < c ? d(i + 1) : void 0, v = i - l - 1 > 1 ? d(1) : void 0, m = i + l + 1 < c ? d(c) : void 0, h = k(1, c + 1).filter(f).map(d);
-    return !v && ((w = h[0]) == null ? void 0 : w.page) === 2 && h.unshift(d(1)), !m && ((N = h[h.length - 1]) == null ? void 0 : N.page) === c - 1 && h.push(d(c)), {
+    }), p = i > 1 ? f(i - 1) : void 0, g = i < c ? f(i + 1) : void 0, v = i - l - 1 > 1 ? f(1) : void 0, m = i + l + 1 < c ? f(c) : void 0, h = k(1, c + 1).filter(d).map(f);
+    return !v && ((w = h[0]) == null ? void 0 : w.page) === 2 && h.unshift(f(1)), !m && ((N = h[h.length - 1]) == null ? void 0 : N.page) === c - 1 && h.push(f(c)), {
       totalPages: c,
-      resultsFrom: n,
-      resultsTo: a,
-      current: u,
+      resultsFrom: t,
+      resultsTo: u,
+      current: a,
       prev: p,
       next: g,
       first: v,
       last: m,
       pages: h
     };
-  }, [o, t, e == null ? void 0 : e.width]);
+  }, [o, n, e == null ? void 0 : e.width]);
 }
 function Z() {
-  const [e, o] = M([]), [t, r] = M([]);
+  const [e, o] = M([]), [n, s] = M([]);
   return C(() => {
-    L(async (s) => {
-      const { products: l, segments: i } = await s.getSearchSessionParams();
-      o(i ?? []), r((l == null ? void 0 : l.personalizationBoost) ?? []);
+    L(async (r) => {
+      const { products: l, segments: i } = await r.getSearchSessionParams();
+      o(i ?? []), s((l == null ? void 0 : l.personalizationBoost) ?? []);
     });
   }, []), {
     segments: e,
-    boost: t
+    boost: n
   };
 }
 function O() {
-  const { facets: e } = y((n) => {
-    var a;
+  const { facets: e } = y((t) => {
+    var u;
     return {
-      facets: ((a = n.response.products) == null ? void 0 : a.facets) ?? []
+      facets: ((u = t.response.products) == null ? void 0 : u.facets) ?? []
     };
-  }), { replaceFilter: o, toggleProductFilter: t } = x(), r = S(
-    (n) => {
-      const a = e == null ? void 0 : e.find((u) => u.type === "stats" && u.field === n);
-      if (a && "min" in a && "max" in a)
-        return a;
+  }), { replaceFilter: o, toggleProductFilter: n } = x(), s = S(
+    (t) => {
+      const u = e == null ? void 0 : e.find((a) => a.type === "stats" && a.field === t);
+      if (u && "min" in u && "max" in u)
+        return u;
     },
     [e]
-  ), s = S(
-    (n) => {
-      var a;
-      return ((a = e == null ? void 0 : e.find((u) => u.field === n)) == null ? void 0 : a.name) ?? n;
+  ), r = S(
+    (t) => {
+      var u;
+      return ((u = e == null ? void 0 : e.find((a) => a.field === t)) == null ? void 0 : u.name) ?? t;
     },
     [e]
-  ), l = S((n) => "field" in n && (n.value instanceof Array || n.range instanceof Array), []), i = S((n) => {
-    var a;
+  ), l = S((t) => "field" in t && (t.value instanceof Array || t.range instanceof Array), []), i = S((t) => {
+    var u;
     return {
-      ...n,
-      range: (a = n.range) == null ? void 0 : a.map((u) => ({
-        gt: u.gt ? Number(u.gt) : u.gt,
-        gte: u.gte ? Number(u.gte) : u.gte,
-        lt: u.lt ? Number(u.lt) : u.lt,
-        lte: u.lte ? Number(u.lte) : u.lte
+      ...t,
+      range: (u = t.range) == null ? void 0 : u.map((a) => ({
+        gt: a.gt ? Number(a.gt) : a.gt,
+        gte: a.gte ? Number(a.gte) : a.gte,
+        lt: a.lt ? Number(a.lt) : a.lt,
+        lte: a.lte ? Number(a.lte) : a.lte
       }))
     };
   }, []), c = S(
-    (n) => (n.value ?? []).map((u) => ({
-      value: u,
-      field: n.field,
-      name: s(n.field),
-      filter: i(n),
+    (t) => (t.value ?? []).map((a) => ({
+      value: a,
+      field: t.field,
+      name: r(t.field),
+      filter: i(t),
       remove: () => {
-        t(n.field, u, !1);
+        n(t.field, a, !1);
       }
     })),
-    [i, s, t]
-  ), f = S(
-    (n) => (n.range ?? []).map((u) => {
+    [i, r, n]
+  ), d = S(
+    (t) => (t.range ?? []).map((a) => {
       var g, v;
-      const d = u.gte ?? u.gt ?? ((g = r(n.field)) == null ? void 0 : g.min), p = u.lte ?? u.lt ?? ((v = r(n.field)) == null ? void 0 : v.max);
-      if (d !== void 0 && p !== void 0)
+      const f = a.gte ?? a.gt ?? ((g = s(t.field)) == null ? void 0 : g.min), p = a.lte ?? a.lt ?? ((v = s(t.field)) == null ? void 0 : v.max);
+      if (f !== void 0 && p !== void 0)
         return {
-          value: `${d} - ${p}`,
-          field: n.field,
-          name: s(n.field),
-          filter: i(n),
+          value: `${f} - ${p}`,
+          field: t.field,
+          name: r(t.field),
+          filter: i(t),
           remove: () => {
-            o(n.field, void 0);
+            o(t.field, void 0);
           }
         };
     }).filter(Boolean),
-    [i, r, s, o]
+    [i, s, r, o]
   );
   return {
     selectFilters: l,
     toValueFilter: c,
-    toRangeFilter: f
+    toRangeFilter: d
   };
 }
 function j() {
   const { filter: e } = y((c) => {
-    var f;
+    var d;
     return {
-      filter: ((f = c.query.products) == null ? void 0 : f.filter) ?? []
+      filter: ((d = c.query.products) == null ? void 0 : d.filter) ?? []
     };
-  }), { updateSearch: o } = x(), { selectFilters: t, toValueFilter: r, toRangeFilter: s } = O(), l = b(() => e ? e.filter(t).flatMap((c) => "value" in c ? r(c) : "range" in c ? s(c) : []).filter(Boolean) : [], [e, t, s, r]), i = S(() => {
+  }), { updateSearch: o } = x(), { selectFilters: n, toValueFilter: s, toRangeFilter: r } = O(), l = b(() => e ? e.filter(n).flatMap((c) => "value" in c ? s(c) : "range" in c ? r(c) : []).filter(Boolean) : [], [e, n, r, s]), i = S(() => {
     o({
       products: {
         filter: []
@@ -176,12 +179,12 @@ function j() {
   };
 }
 function V(e) {
-  var u, d, p;
-  const { replaceFilter: o } = x(), { query: t, products: r } = y((g) => ({
+  var a, f, p;
+  const { replaceFilter: o } = x(), { query: n, products: s } = y((g) => ({
     query: g.query,
     products: g.response.products
-  })), s = (u = r == null ? void 0 : r.facets) == null ? void 0 : u.find((g) => g.id === e);
-  if (!s)
+  })), r = (a = s == null ? void 0 : s.facets) == null ? void 0 : a.find((g) => g.id === e);
+  if (!r)
     return {
       min: 0,
       max: 0,
@@ -189,44 +192,44 @@ function V(e) {
       updateRange: () => {
       }
     };
-  const l = (p = (d = t.products) == null ? void 0 : d.filter) == null ? void 0 : p.find((g) => g.field === s.field), i = l != null && l.range ? l.range[0] : void 0, c = typeof i == "object" && ("gte" in i || "lte" in i) ? [z(i.gte), z(i.lte)] : [void 0, void 0], f = "min" in s ? Math.floor(s.min) : 0, n = "max" in s ? Math.ceil(s.max) : 0, a = ([g, v]) => {
+  const l = (p = (f = n.products) == null ? void 0 : f.filter) == null ? void 0 : p.find((g) => g.field === r.field), i = l != null && l.range ? l.range[0] : void 0, c = typeof i == "object" && ("gte" in i || "lte" in i) ? [z(i.gte), z(i.lte)] : [void 0, void 0], d = "min" in r ? Math.floor(r.min) : 0, t = "max" in r ? Math.ceil(r.max) : 0, u = ([g, v]) => {
     const m = g !== void 0 ? Math.floor(g) : void 0, h = v !== void 0 ? Math.ceil(v) : void 0, F = m !== void 0, w = h !== void 0;
-    (f === m || !F) && (n === h || !w) ? o(s.field, void 0) : (f === m || !F) && w ? o(s.field, {
+    (d === m || !F) && (t === h || !w) ? o(r.field, void 0) : (d === m || !F) && w ? o(r.field, {
       lte: h.toString()
-    }) : (n === h || !w) && F ? o(s.field, {
+    }) : (t === h || !w) && F ? o(r.field, {
       gte: m.toString()
-    }) : F && w && o(s.field, {
+    }) : F && w && o(r.field, {
       gte: m.toString(),
       lte: h.toString()
     });
   };
   return {
     /** Min value */
-    min: f,
+    min: d,
     /** Max value */
-    max: n,
+    max: t,
     /** Range value */
-    range: [c[0] ?? f, c[1] ?? n],
+    range: [c[0] ?? d, c[1] ?? t],
     /** Update range function */
-    updateRange: a
+    updateRange: u
   };
 }
 function ee(e, o) {
-  const { min: t, max: r, range: s, updateRange: l } = V(e), { filters: i } = j(), c = b(() => {
+  const { min: n, max: s, range: r, updateRange: l } = V(e), { filters: i } = j(), c = b(() => {
     var v;
-    const u = i.find((m) => {
+    const a = i.find((m) => {
       var h;
       return (h = m == null ? void 0 : m.filter) == null ? void 0 : h.range;
     });
-    let d = null;
-    if (u) {
-      const m = (v = u.filter.range) == null ? void 0 : v[0];
-      d = [z(m == null ? void 0 : m.gte), z(m == null ? void 0 : m.lte)];
+    let f = null;
+    if (a) {
+      const m = (v = a.filter.range) == null ? void 0 : v[0];
+      f = [z(m == null ? void 0 : m.gte), z(m == null ? void 0 : m.lte)];
     }
     const p = [];
-    let g = Math.floor(t / o) * o;
-    for (; g < r; ) {
-      const m = g + o, h = d && d[0] === g && d[1] === m;
+    let g = Math.floor(n / o) * o;
+    for (; g < s; ) {
+      const m = g + o, h = f && f[0] === g && f[1] === m;
       p.push({
         min: g,
         max: m,
@@ -234,32 +237,32 @@ function ee(e, o) {
       }), g = m;
     }
     return p;
-  }, [i, t, r, o]), f = (u) => {
-    l([u, s[1]]);
-  }, n = (u) => {
-    l([s[0], u]);
-  }, a = t !== s[0] || r !== s[1];
+  }, [i, n, s, o]), d = (a) => {
+    l([a, r[1]]);
+  }, t = (a) => {
+    l([r[0], a]);
+  }, u = n !== r[0] || s !== r[1];
   return {
     /** Minimum value */
-    min: t,
+    min: n,
     /** Maximum value */
-    max: r,
+    max: s,
     /** Range value */
-    range: s,
+    range: r,
     /** Update range function */
     updateRange: l,
     /** Ranges */
     ranges: c,
     /** Handle min change */
-    handleMinChange: f,
+    handleMinChange: d,
     /** Handle max change */
-    handleMaxChange: n,
+    handleMaxChange: t,
     /** Is selected */
-    isSelected: a
+    isSelected: u
   };
 }
 function te() {
-  const { products: e, keywords: o } = y((t) => t.response);
+  const { products: e, keywords: o } = y((n) => n.response);
   return {
     /** Array of products */
     products: e ?? { hits: [], total: 0 },
@@ -268,63 +271,63 @@ function te() {
   };
 }
 function ne() {
-  const e = y((t) => {
-    var r;
-    return (r = t.query.products) == null ? void 0 : r.filter;
+  const e = y((n) => {
+    var s;
+    return (s = n.query.products) == null ? void 0 : s.filter;
   });
-  return b(() => e ? e.reduce((t, r) => t + (Array.isArray(r.value) ? r.value.length : 1), 0) : 0, [e]);
+  return b(() => e ? e.reduce((n, s) => n + (Array.isArray(s.value) ? s.value.length : 1), 0) : 0, [e]);
 }
 function A(e) {
   return e && !Number.isNaN(e) ? e : 0;
 }
 function re(e, o) {
-  const { from: t, size: r, total: s } = y((n) => {
-    var a, u, d, p, g;
+  const { from: n, size: s, total: r } = y((t) => {
+    var u, a, f, p, g;
     return {
-      from: A(((a = n.query.products) == null ? void 0 : a.from) ?? 0),
-      size: A(((d = (u = n.response) == null ? void 0 : u.products) == null ? void 0 : d.size) ?? 0),
-      total: A(((g = (p = n.response) == null ? void 0 : p.products) == null ? void 0 : g.total) ?? 0)
+      from: A(((u = t.query.products) == null ? void 0 : u.from) ?? 0),
+      size: A(((f = (a = t.response) == null ? void 0 : a.products) == null ? void 0 : f.size) ?? 0),
+      total: A(((g = (p = t.response) == null ? void 0 : p.products) == null ? void 0 : g.total) ?? 0)
     };
-  }), { updateSearch: l } = x(), i = t + r, c = [...e].reverse().filter((n) => n + o < s);
+  }), { updateSearch: l } = x(), i = n + s, c = [...e].reverse().filter((t) => t + o < r);
   return {
     /** from value */
-    from: t,
+    from: n,
     /** to value */
     to: i,
     /** total value */
-    total: s,
+    total: r,
     /** size value */
-    size: r,
+    size: s,
     /** Array of size options */
     sizeOptions: c,
     /** Should be called when size is changed */
-    handleSizeChange: (n) => {
+    handleSizeChange: (t) => {
       l({
         products: {
-          size: z(n)
+          size: z(t)
         }
       });
     }
   };
 }
 function B(e, o) {
-  return e.length !== o.length ? !1 : e.every((t) => o.find((r) => t.field === r.field && t.order === r.order));
+  return e.length !== o.length ? !1 : e.every((n) => o.find((s) => n.field === s.field && n.order === s.order));
 }
 function se(e) {
   var l, i;
-  const o = y((c) => c.query), { updateSearch: t } = x();
+  const o = y((c) => c.query), { updateSearch: n } = x();
   return {
     /** Active sort */
     activeSort: ((l = e.find((c) => {
-      var f;
-      return B(c.value.sort, ((f = o.products) == null ? void 0 : f.sort) || []);
+      var d;
+      return B(c.value.sort, ((d = o.products) == null ? void 0 : d.sort) || []);
     })) == null ? void 0 : l.id) ?? ((i = e[0]) == null ? void 0 : i.id),
     /** Set sort function */
     setSort: (c) => {
-      const f = e.find((n) => n.id === c);
-      f && t({
+      const d = e.find((t) => t.id === c);
+      d && n({
         products: {
-          sort: f.value.sort
+          sort: d.value.sort
         }
       });
     }
@@ -344,22 +347,22 @@ function E({
   language: e = "en-US",
   interimResults: o = !1
 } = {}) {
-  const [t, r] = M(!1), s = q(null), l = S(
-    ({ onResult: c, onError: f }) => {
-      const n = new P();
-      n.lang = e, n.interimResults = o, n.onstart = () => r(!0), n.onresult = (a) => {
-        var d, p;
-        const { transcript: u } = (p = (d = a.results) == null ? void 0 : d[0]) == null ? void 0 : p[0];
-        c(u);
-      }, f && (n.onerror = (a) => f(a.error)), n.onend = () => r(!1), s.current = n, n.start();
+  const [n, s] = M(!1), r = q(null), l = S(
+    ({ onResult: c, onError: d }) => {
+      const t = new P();
+      t.lang = e, t.interimResults = o, t.onstart = () => s(!0), t.onresult = (u) => {
+        var f, p;
+        const { transcript: a } = (p = (f = u.results) == null ? void 0 : f[0]) == null ? void 0 : p[0];
+        c(a);
+      }, d && (t.onerror = (u) => d(u.error)), t.onend = () => s(!1), r.current = t, t.start();
     },
     [e, o]
   ), i = S(() => {
     var c;
-    (c = s.current) == null || c.stop();
-  }, [s]);
+    (c = r.current) == null || c.stop();
+  }, [r]);
   return {
-    listening: t,
+    listening: n,
     startListening: l,
     stopListening: i
   };
@@ -367,16 +370,16 @@ function E({
 const oe = D ? E : U;
 function $(e, o) {
   if (!e.length || !o.length) return [];
-  const t = o.reduce((r, s) => (r[s] = {}, r), {});
-  return e.forEach((r) => {
-    var s;
-    (s = r.customFields) == null || s.forEach(({ key: l, value: i }) => {
+  const n = o.reduce((s, r) => (s[r] = {}, s), {});
+  return e.forEach((s) => {
+    var r;
+    (r = s.customFields) == null || r.forEach(({ key: l, value: i }) => {
       const c = l.toLowerCase();
-      o.includes(c) && (t[c][i] = t[c][i] || [], t[c][i].push(r));
+      o.includes(c) && (n[c][i] = n[c][i] || [], n[c][i].push(s));
     });
-  }), Object.entries(t).map(([r, s]) => ({
-    field: r,
-    options: Object.entries(s).map(([l, i]) => ({
+  }), Object.entries(n).map(([s, r]) => ({
+    field: s,
+    options: Object.entries(r).map(([l, i]) => ({
       value: l,
       skus: i,
       unavailable: !1,
@@ -385,16 +388,16 @@ function $(e, o) {
   }));
 }
 function I(e, o) {
-  return e.length ? e.map(({ field: t, options: r }) => ({
-    field: t,
-    options: r.map((s) => {
+  return e.length ? e.map(({ field: n, options: s }) => ({
+    field: n,
+    options: s.map((r) => {
       var c;
-      const l = !((c = s.skus) != null && c.some((f) => Object.entries(o).every(([n, a]) => {
-        var d, p;
-        return n === t ? !0 : ((p = (d = f.customFields) == null ? void 0 : d.find((g) => g.key.toLowerCase() === n)) == null ? void 0 : p.value) === a;
-      }))), i = o[t] === s.value;
+      const l = !((c = r.skus) != null && c.some((d) => Object.entries(o).every(([t, u]) => {
+        var f, p;
+        return t === n ? !0 : ((p = (f = d.customFields) == null ? void 0 : f.find((g) => g.key.toLowerCase() === t)) == null ? void 0 : p.value) === u;
+      }))), i = o[n] === r.value;
       return {
-        ...s,
+        ...r,
         unavailable: l,
         selected: i
       };
@@ -402,16 +405,16 @@ function I(e, o) {
   })) : [];
 }
 function ce(e = [], o = []) {
-  const [t, r] = M({}), s = b(() => I($(e, o), t), [e, o, t]), l = S((c, f) => {
-    r((n) => {
-      const a = { ...n };
-      return a[c] === f ? delete a[c] : a[c] = f, a;
+  const [n, s] = M({}), r = b(() => I($(e, o), n), [e, o, n]), l = S((c, d) => {
+    s((t) => {
+      const u = { ...t };
+      return u[c] === d ? delete u[c] : u[c] = d, u;
     });
-  }, []), i = b(() => Object.keys(t).filter((n) => t[n]).length === 0 ? [] : s.filter(({ field: n }) => t[n]).map(({ field: n, options: a }) => {
-    const u = t[n], d = a.find((p) => p.value === u);
-    return (d == null ? void 0 : d.skus) ?? [];
-  }).reduce((n, a) => n.filter((u) => a.includes(u))), [s, t]);
-  return { swatches: s, toggleOption: l, matchedSkus: i };
+  }, []), i = b(() => Object.keys(n).filter((t) => n[t]).length === 0 ? [] : r.filter(({ field: t }) => n[t]).map(({ field: t, options: u }) => {
+    const a = n[t], f = u.find((p) => p.value === a);
+    return (f == null ? void 0 : f.skus) ?? [];
+  }).reduce((t, u) => t.filter((a) => u.includes(a))), [r, n]);
+  return { swatches: r, toggleOption: l, matchedSkus: i };
 }
 export {
   D as speechToTextSupported,
@@ -419,7 +422,7 @@ export {
   Q as useDecoratedSearchResults,
   W as useFacet,
   X as useFacets,
-  ae as useLoadMore,
+  ue as useLoadMore,
   y as useNostoAppState,
   Y as usePagination,
   Z as usePersonalization,

package/dist/preact/serp.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../index.es-DlUp67LT.cjs"),s=require("../configContext-BR7w4VlU.cjs"),S=require("../renderHeadless-xhkLegO4.cjs"),a=require("../jsxRuntime.module-B3sGoTIU.cjs"),i=require("../baseConfig-BFFqFSg5.cjs"),g="nosto:search:scrollPos";function d(){window.sessionStorage.setItem(g,window.scrollY.toString())}function C({children:e,hit:t,onClick:o}){const{pageType:r}=s.useConfig(),c=r==="autocomplete"?void 0:r==="search"?"serp":r;return S.renderHeadless({children:e,updateElement:(n,u)=>(u.depth>0||(n.props={...n.props,onClick:l=>{t&&c&&p.s(f=>f.recordSearchClick(c,t)),d(),typeof o=="function"&&o(l)}}),n)})}const h={...i.defaultBaseConfig,persistentSearchCache:!1,preservePageScroll:!1};function m(e={}){return{pageType:"search",...h,...e}}function P({config:e,store:t,children:o}){const r=t??s.createStore();return i.useCheckClientScript(),a.u(s.ConfigContext,{value:m(e),children:a.u(s.StoreContext,{value:r,children:o})})}exports.SearchPageProvider=P;exports.SerpElement=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../jsxRuntime.module-B3sGoTIU.cjs"),g=require("../index.es-DlUp67LT.cjs"),t=require("../configContext-BR7w4VlU.cjs"),d=require("preact/hooks"),a=require("../baseConfig-BFFqFSg5.cjs"),k="nosto:search:scrollPos";function h(){window.sessionStorage.setItem(k,window.scrollY.toString())}function p({as:o,children:n,hit:r,componentProps:e}){const{pageType:c}=t.useConfig(),s=c==="autocomplete"?void 0:c==="search"?"serp":c,l=d.useCallback(f=>{r&&s&&g.s(S=>S.recordSearchClick(s,r)),h(),e&&"onClick"in e&&typeof e.onClick=="function"&&e.onClick(f)},[r,e,s]),u={...e,onClick:l},C=o??"a";return i.u(C,{...u,children:n})}const v={...a.defaultBaseConfig,persistentSearchCache:!1,preservePageScroll:!1};function y(o={}){return{pageType:"search",...v,...o}}function m({config:o,store:n,children:r}){const e=n??t.createStore();return a.useCheckClientScript(),i.u(t.ConfigContext,{value:y(o),children:i.u(t.StoreContext,{value:e,children:r})})}exports.SearchPageProvider=m;exports.SerpElement=p;

package/dist/preact/serp.es.js

@@ -1,41 +1,41 @@
-import { s as l } from "../index.es-B8mbAxS4.js";
-import { u as f, c as u, S, C as m } from "../configContext-GuZOIX3o.js";
-import { r as g } from "../renderHeadless-BteGML1G.js";
 import { u as n } from "../jsxRuntime.module-Bzuv3cXw.js";
-import { d as C, u as d } from "../baseConfig-Bafl02NY.js";
+import { s as u } from "../index.es-B8mbAxS4.js";
+import { u as C, c as S, S as g, C as p } from "../configContext-GuZOIX3o.js";
+import { useCallback as m } from "preact/hooks";
+import { d, u as k } from "../baseConfig-Bafl02NY.js";
 const h = "nosto:search:scrollPos";
-function P() {
+function v() {
   window.sessionStorage.setItem(h, window.scrollY.toString());
 }
-function B({ children: e, hit: o, onClick: t }) {
-  const { pageType: r } = f(), a = r === "autocomplete" ? void 0 : r === "search" ? "serp" : r;
-  return g({
-    children: e,
-    updateElement: (s, c) => (c.depth > 0 || (s.props = {
-      ...s.props,
-      onClick: (i) => {
-        o && a && l((p) => p.recordSearchClick(a, o)), P(), typeof t == "function" && t(i);
-      }
-    }), s)
-  });
+function B({ as: o, children: t, hit: r, componentProps: e }) {
+  const { pageType: a } = C(), c = a === "autocomplete" ? void 0 : a === "search" ? "serp" : a, s = m(
+    (l) => {
+      r && c && u((f) => f.recordSearchClick(c, r)), v(), e && "onClick" in e && typeof e.onClick == "function" && e.onClick(l);
+    },
+    [r, e, c]
+  ), i = {
+    ...e,
+    onClick: s
+  };
+  return /* @__PURE__ */ n(o ?? "a", { ...i, children: t });
 }
-const k = {
-  ...C,
+const w = {
+  ...d,
   persistentSearchCache: !1,
   preservePageScroll: !1
 };
-function w(e = {}) {
+function y(o = {}) {
   return {
     pageType: "search",
-    ...k,
-    ...e
+    ...w,
+    ...o
   };
 }
-function H({ config: e, store: o, children: t }) {
-  const r = o ?? u();
-  return d(), /* @__PURE__ */ n(m, { value: w(e), children: /* @__PURE__ */ n(S, { value: r, children: t }) });
+function E({ config: o, store: t, children: r }) {
+  const e = t ?? S();
+  return k(), /* @__PURE__ */ n(p, { value: y(o), children: /* @__PURE__ */ n(g, { value: e, children: r }) });
 }
 export {
-  H as SearchPageProvider,
+  E as SearchPageProvider,
   B as SerpElement
 };

package/dist/preact/src/components/SearchInput.d.ts

@@ -1,7 +1,10 @@
-import { ComponentChildren } from 'preact';
-type Props = {
-    children: ComponentChildren;
+import { ComponentChildren, ComponentProps, ComponentType, JSX } from 'preact';
+type AsComponent = keyof JSX.IntrinsicElements | ComponentType<any>;
+type Props<C extends AsComponent> = {
+    as?: C;
     onSearchInput: (target: HTMLInputElement) => void;
+    children?: ComponentChildren;
+    componentProps?: JSX.LibraryManagedAttributes<C, ComponentProps<C>>;
 };
-export declare function SearchInput({ children, onSearchInput }: Props): ComponentChildren;
+export declare function SearchInput<C extends AsComponent>({ as, componentProps, onSearchInput, children }: Props<C>): JSX.Element;
 export {};

package/dist/preact/src/components/SerpElement.d.ts

@@ -1,18 +1,21 @@
-import { ComponentChildren } from 'preact';
+import { ComponentChildren, ComponentProps, ComponentType, JSX } from 'preact';
+type AsComponent = keyof JSX.IntrinsicElements | ComponentType<any>;
 /**
  * @group Components
  */
-export type SerpElementProps = {
-    children: ComponentChildren;
+export type SerpElementProps<C extends AsComponent> = {
     hit: {
         productId: string;
         url?: string;
     };
-    onClick?: (event: Event) => void;
+    as?: C;
+    componentProps?: JSX.LibraryManagedAttributes<C, ComponentProps<C>>;
+    children?: ComponentChildren;
 };
 /**
  * Wrapper component that can be used to wrap any element in the search result list.
  *
  * @group Components
  */
-export declare function SerpElement({ children, hit, onClick }: SerpElementProps): ComponentChildren;
+export declare function SerpElement<C extends AsComponent>({ as, children, hit, componentProps }: SerpElementProps<C>): JSX.Element;
+export {};

package/dist/preact/src/hooks/useFacet.d.ts

@@ -1,4 +1,10 @@
 import { SearchTermsFacet } from '@nosto/nosto-js/client';
+/**
+ * Extra options for the useFacet hook.
+ */
+export interface UseFacetOptions {
+    active?: boolean;
+}
 /**
  * Preact hook that provides facet state to the component.
  * @param facet
@@ -48,7 +54,7 @@ import { SearchTermsFacet } from '@nosto/nosto-js/client';
  * ```
  * @group Hooks
  */
-export declare function useFacet(facet: SearchTermsFacet): {
+export declare function useFacet(facet: SearchTermsFacet, options?: UseFacetOptions): {
     /** Active value */
     active: boolean;
     /** Selected filters count */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nosto/search-js",
-  "version": "2.11.1",
+  "version": "2.12.1",
   "license": "ISC",
   "type": "module",
   "files": [

package/dist/preact/src/dom/renderHeadless.d.ts

@@ -1,18 +0,0 @@
-import { ComponentChildren, VNode } from 'preact';
-type Props = {
-    children: ComponentChildren;
-    /**
-     * Update the element with custom logic. Each vnode (valid JSX element) will be passed to this function recursively.
-     * You may either mutate the existing node, or create a new one.
-     *
-     * @param vnode Current target node
-     * @returns {VNode} if the vnode should be updated
-     * @returns {null} if the vnode should be removed
-     */
-    updateElement: <P extends object>(vnode: VNode<P>, context: Context) => VNode<P> | null;
-};
-type Context = {
-    depth: number;
-};
-export declare function renderHeadless(props: Props, ctx?: Context): ComponentChildren;
-export {};

package/dist/preact/src/dom/utils.d.ts

@@ -1,5 +0,0 @@
-import { VNode } from 'preact';
-import { JSX } from 'preact/jsx-runtime';
-export type UnknownVnode = VNode<any>;
-export declare function isHTMLInput(vnode: UnknownVnode): vnode is VNode<JSX.IntrinsicElements["input"]>;
-export declare function isVNode(child: unknown): child is VNode;

package/dist/renderHeadless-BteGML1G.js

@@ -1,23 +0,0 @@
-import { toChildArray as o } from "preact";
-function d(e) {
-  return e.type === "input";
-}
-function u(e) {
-  return !!e && typeof e == "object" && "type" in e && "props" in e;
-}
-function i(e, t = { depth: 0 }) {
-  const { children: p } = e;
-  return o(p).map((r) => {
-    if (!u(r))
-      return r;
-    const n = e.updateElement(r, t);
-    return n === null ? null : (n.props = {
-      ...n.props,
-      children: i({ ...e, children: n.props.children }, { depth: t.depth + 1 })
-    }, n);
-  });
-}
-export {
-  d as i,
-  i as r
-};

package/dist/renderHeadless-xhkLegO4.cjs

@@ -1 +0,0 @@
-"use strict";const s=require("preact");function i(e){return e.type==="input"}function o(e){return!!e&&typeof e=="object"&&"type"in e&&"props"in e}function u(e,t={depth:0}){const{children:p}=e;return s.toChildArray(p).map(r=>{if(!o(r))return r;const n=e.updateElement(r,t);return n===null?null:(n.props={...n.props,children:u({...e,children:n.props.children},{depth:t.depth+1})},n)})}exports.isHTMLInput=i;exports.renderHeadless=u;