@askdialog/dialog-react 2.4.0 → 2.6.0

package/dist/dialog-react.umd.cjs

@@ -1 +1 @@
-(function(f,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("react/jsx-runtime"),require("react"),require("@askdialog/dialog-sdk"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@askdialog/dialog-sdk","react-dom"],s):(f=typeof globalThis<"u"?globalThis:f||self,s(f["dialog-react"]={},f["react/jsx-runtime"],f.React,f.dialogSdk,f.ReactDOM))})(this,(function(f,s,d,b,P){"use strict";const m=({title:e="Your expert",description:t="A question about this product?"})=>s.jsxs("div",{className:"dialog-block-header-container",children:[s.jsx("div",{className:"dialog-block-title",children:e}),s.jsx("div",{className:"dialog-block-description",children:t})]}),E=({color:e="#181825"})=>s.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[s.jsxs("g",{clipPath:"url(#clip0_466_934)",children:[s.jsx("path",{d:"M5.41675 10.8333L6.07046 12.1408C6.2917 12.5832 6.40232 12.8045 6.55011 12.9962C6.68124 13.1663 6.83375 13.3188 7.00388 13.45C7.19559 13.5977 7.41684 13.7084 7.85932 13.9296L9.16675 14.5833L7.85932 15.237C7.41684 15.4583 7.19559 15.5689 7.00388 15.7167C6.83375 15.8478 6.68124 16.0003 6.55011 16.1704C6.40232 16.3622 6.2917 16.5834 6.07046 17.0259L5.41675 18.3333L4.76303 17.0259C4.54179 16.5834 4.43117 16.3622 4.28339 16.1704C4.15225 16.0003 3.99974 15.8478 3.82962 15.7167C3.6379 15.5689 3.41666 15.4583 2.97418 15.237L1.66675 14.5833L2.97418 13.9296C3.41666 13.7084 3.6379 13.5977 3.82962 13.45C3.99974 13.3188 4.15225 13.1663 4.28339 12.9962C4.43117 12.8045 4.54179 12.5832 4.76303 12.1408L5.41675 10.8333Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),s.jsx("path",{d:"M12.5001 1.66666L13.4823 4.22034C13.7173 4.83136 13.8348 5.13688 14.0175 5.39386C14.1795 5.62162 14.3785 5.82061 14.6062 5.98256C14.8632 6.16529 15.1687 6.2828 15.7797 6.5178L18.3334 7.49999L15.7797 8.48217C15.1687 8.71718 14.8632 8.83469 14.6062 9.01742C14.3785 9.17937 14.1795 9.37836 14.0175 9.60612C13.8348 9.8631 13.7173 10.1686 13.4823 10.7796L12.5001 13.3333L11.5179 10.7796C11.2829 10.1686 11.1654 9.8631 10.9827 9.60612C10.8207 9.37836 10.6217 9.17937 10.3939 9.01742C10.137 8.83469 9.83145 8.71718 9.22043 8.48217L6.66675 7.49999L9.22043 6.5178C9.83145 6.28279 10.137 6.16529 10.3939 5.98256C10.6217 5.82061 10.8207 5.62162 10.9827 5.39386C11.1654 5.13688 11.2829 4.83136 11.5179 4.22034L12.5001 1.66666Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),s.jsx("defs",{children:s.jsx("clipPath",{id:"clip0_466_934",children:s.jsx("rect",{width:"20",height:"20",fill:"white"})})})]}),L=({client:e,questions:t,productId:r,productTitle:o,selectedVariantId:i})=>{const l=c=>{e.sendProductMessage({productId:r,productTitle:o,selectedVariantId:i,question:c,fromQuestionSuggestion:!0})};return s.jsx(s.Fragment,{children:t.map(c=>s.jsxs("button",{className:"dialog-block-suggestions-item",onClick:()=>l(c.question),children:[s.jsx(E,{color:e.theme.primaryColor}),s.jsx("span",{className:"dialog-block-suggestions-item-label",children:c.question})]},c.question))})},D=()=>s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"})]}),_=({client:e,questions:t,isLoading:r,productId:o,productTitle:i,selectedVariantId:l})=>s.jsx("div",{className:"dialog-block-suggestions-container",children:r||!t?s.jsx(D,{}):s.jsx(L,{client:e,questions:t,productId:o,productTitle:i,selectedVariantId:l})}),A=({color:e="#ffffff"})=>s.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:s.jsx("path",{d:"M10 16.6667V3.33334M10 3.33334L5 8.33334M10 3.33334L15 8.33334",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),y=({client:e,placeholder:t="Ask anything...",productId:r,productTitle:o,selectedVariantId:i})=>{const l=d.useRef(null),[c,n]=d.useState(""),a=()=>{var u;(u=l.current)==null||u.focus()},h=()=>{const u=c;u.trim()&&(e.sendProductMessage({productId:r,productTitle:o,selectedVariantId:i,question:u,fromQuestionSuggestion:!0}),n(""))},S=u=>{u.key==="Enter"&&h()};return s.jsxs("div",{className:"dialog-input-wrapper",onClick:a,children:[s.jsx("input",{id:"dialog-ask-anything-input-ai-input",ref:l,value:c,onChange:u=>n(u.target.value),className:"dialog-ask-anything-input-ai-input",placeholder:t,onKeyDown:S}),s.jsx("button",{id:"send-message-button-ai-input",className:"dialog-input-submit",disabled:!c.trim(),onClick:h,children:s.jsx(A,{color:e.theme.ctaTextColor})})]})},w=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase(),I=e=>{if(!e)return;const t=document.body;Object.keys(e).forEach(r=>{const o=r,i=w(r);if(e[o]!==void 0){if(typeof e[o]=="object"){Object.keys(e[o]).forEach(l=>{var n;const c=l;if(c!==void 0){const a=w(l),h=e[o];t.style.setProperty(`--dialog-theme-${i}-${a}`,(n=h[c])==null?void 0:n.toString())}});return}if(o==="ctaBorderType"){const l=e[o]==="rounded"?"24px":"0";t.style.setProperty(`--dialog-theme-${i}`,l);return}t.style.setProperty(`--dialog-theme-${i}`,e[o].toString())}})},M=({theme:e,children:t})=>(d.useEffect(()=>{e&&I(e)},[e]),s.jsx(s.Fragment,{children:t})),F=({client:e,productId:t,productTitle:r,selectedVariantId:o,enableInput:i=!0})=>{const[l,c]=d.useState(!0),[n,a]=d.useState(void 0);d.useEffect(()=>{b.registerDialogInstallation({method:"react",version:"2.4.0"}),b.addAuditCapability("pdp-block")},[]);const h=d.useMemo(()=>l?"":n==null?void 0:n.assistantName,[n,l]),S=d.useMemo(()=>l?"":n==null?void 0:n.description,[n,l]),u=d.useMemo(()=>l?"":n==null?void 0:n.inputPlaceholder,[n,l]),p=d.useMemo(()=>{var g;return b.resolveTextDirection((g=e.getLocalizationInformations())==null?void 0:g.languageCode)},[e]);return d.useEffect(()=>{let g=!0;return(async()=>{c(!0),a(void 0);try{const C=await e.getSuggestions(t);g&&a(C)}catch(C){console.error("error",C)}finally{g&&c(!1)}})(),()=>{g=!1}},[e,t]),s.jsx(M,{theme:e.theme,children:s.jsxs("div",{id:"dialog-instant",className:"dialog-block-container",dir:p,children:[s.jsx(m,{title:h,description:S}),s.jsx(_,{client:e,questions:n==null?void 0:n.questions,isLoading:l,productId:t,productTitle:r,selectedVariantId:o}),i&&s.jsx(y,{client:e,placeholder:u,productId:t,productTitle:r,selectedVariantId:o})]})})},O=()=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:"M8 13V3M8 3L3 8M8 3L13 8",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),T="M5.3217 0.588255C5.63241 -0.196084 6.36759 -0.196085 6.6783 0.588254C6.98901 1.37259 7.68193 2.82807 8.42693 3.57307C9.17193 4.31807 10.6274 5.01099 11.4117 5.3217C12.1961 5.63241 12.1961 6.36759 11.4117 6.6783C10.6274 6.98901 9.17193 7.68193 8.42693 8.42693C7.68193 9.17193 6.98901 10.6274 6.6783 11.4117C6.36759 12.1961 5.63241 12.1961 5.3217 11.4117C5.01099 10.6274 4.31807 9.17193 3.57307 8.42693C2.82808 7.68193 1.37259 6.98901 0.588255 6.6783C-0.196084 6.36759 -0.196085 5.63241 0.588254 5.3217C1.37259 5.01099 2.82807 4.31807 3.57307 3.57307C4.31807 2.82808 5.01099 1.37259 5.3217 0.588255Z",B=({color:e="currentColor"})=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:T,fill:e})}),q=({controller:e,placeholder:t="Search products...",autoFocus:r=!1,submitAriaLabel:o="Search"})=>{const[i,l]=d.useState(""),c=n=>{n.preventDefault(),e.submit(i)};return s.jsxs("form",{className:"dialog-search-bar",role:"search",onSubmit:c,children:[s.jsxs("div",{className:"dialog-search-bar-field",children:[s.jsx("span",{className:"dialog-search-bar-icon",children:s.jsx(B,{})}),s.jsx("input",{type:"text",name:"dialog-search-query",className:"dialog-search-bar-input",value:i,"aria-label":t,placeholder:t,autoFocus:r,onChange:n=>{l(n.target.value),e.setQuery(n.target.value)}})]}),s.jsx("button",{type:"submit",className:"dialog-search-bar-submit","aria-label":o,children:s.jsx(O,{})})]})},N=({controller:e,state:t})=>{const r=t.response;return r===void 0||r.nbPages<=1?null:s.jsxs("nav",{"aria-label":"Search results pages",className:"dialog-search-pagination",children:[s.jsx("button",{type:"button",disabled:r.page===0,onClick:()=>e.setPage(r.page-1),children:"Previous"}),s.jsxs("span",{children:["Page ",r.page+1," / ",r.nbPages]}),s.jsx("button",{type:"button",disabled:r.page>=r.nbPages-1,onClick:()=>e.setPage(r.page+1),children:"Next"})]})},v=({amount:e,currencyCode:t},r)=>t===void 0?new Intl.NumberFormat(r).format(Number(e)):new Intl.NumberFormat(r,{style:"currency",currency:t}).format(Number(e)),H=({min:e,max:t},r)=>e.amount===t.amount?v(e,r):`${v(e,r)} – ${v(t,r)}`,V=(e,t)=>{if(e===void 0)return"";try{return H(e,t)}catch{return""}},x=e=>{try{const{protocol:t}=new URL(e,window.location.href);return t==="http:"||t==="https:"?e:void 0}catch{return}},k=({controller:e,hit:t,index:r,locale:o})=>{const i=d.useRef(null);d.useEffect(()=>{i.current!==null&&e.observeResult(i.current,r)},[e,t,r]);const l=u=>{const p=u.metaKey||u.ctrlKey||u.shiftKey||u.altKey;e.selectResult(r,{navigate:!p})&&u.preventDefault()},c=u=>{u.button===1&&e.selectResult(r,{navigate:!1})},n=t.title??t.objectID,a=V(t.priceRange,o),h=t.url===void 0?void 0:x(t.url),S=s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"dialog-search-card-image",children:t.imageUrl!==void 0&&s.jsx("img",{src:t.imageUrl,alt:n,loading:"lazy"})}),s.jsxs("div",{className:"dialog-search-card-info",children:[s.jsx("p",{className:"dialog-search-card-title",children:n}),a!==""&&s.jsx("p",{className:"dialog-search-card-price",children:a})]})]});return s.jsx("li",{ref:i,className:"dialog-search-card",children:h===void 0?s.jsx("div",{className:"dialog-search-card-body",children:S}):s.jsx("a",{className:"dialog-search-card-body",href:h,onClick:l,onAuxClick:c,children:S})})},K=e=>{const t=d.useRef(null),[r,o]=d.useState(void 0),[i,l]=d.useState(0);return d.useLayoutEffect(()=>{if(!e)return;const c=()=>{const n=t.current;if(n===null)return;const a=n.previousElementSibling??n,{top:h,bottom:S,left:u,width:p}=a.getBoundingClientRect();l(window.innerHeight),o(g=>g!==void 0&&g.top===h&&g.bottom===S&&g.left===u&&g.width===p?g:{top:h,bottom:S,left:u,width:p})};return c(),window.addEventListener("scroll",c,!0),window.addEventListener("resize",c),()=>{window.removeEventListener("scroll",c,!0),window.removeEventListener("resize",c)}},[e]),{anchorRef:t,rect:r,viewportHeight:i}},$=(e,t)=>{const[r,o]=d.useState(!1),i=d.useRef(null),l=e.status!==b.SearchStatus.IDLE&&!r;return d.useEffect(()=>{o(!1)},[e.query]),d.useEffect(()=>{if(!l)return;const c=n=>{var p,g;const a=n.target;if(!(a instanceof Node))return;const h=(p=t.current)==null?void 0:p.previousElementSibling,S=((g=i.current)==null?void 0:g.contains(a))??!1,u=(h==null?void 0:h.contains(a))??!1;!S&&!u&&o(!0)};return document.addEventListener("pointerdown",c),()=>document.removeEventListener("pointerdown",c)},[l,t]),d.useEffect(()=>{var a;const c=(a=t.current)==null?void 0:a.previousElementSibling;if(c==null)return;const n=()=>o(!1);return c.addEventListener("focusin",n),()=>c.removeEventListener("focusin",n)},[t]),{isOpen:l,panelRef:i}},X=e=>e instanceof b.DialogSearchError?`Search failed (${e.status}${e.code?` ${e.code}`:""}): ${e.message}`:"Search failed: network error. Check your connection and try again.",j=(e,t)=>e.bottom>0&&e.top<t,W=(e,t)=>{const r=t-e.bottom-8-16,o=e.top-8-16,i={left:e.left,width:e.width};return r<200&&o>r?{...i,bottom:t-e.top+8,maxHeight:Math.max(o,0)}:{...i,top:e.bottom+8,maxHeight:Math.max(r,0)}},Q=(e,t,r)=>{const o=t.response;switch(t.status){case b.SearchStatus.LOADING:return s.jsxs("p",{role:"status",className:"dialog-search-status",children:["Searching “",t.query,"”…"]});case b.SearchStatus.ERROR:return s.jsxs("div",{className:"dialog-search-error",children:[s.jsx("p",{role:"alert",className:"dialog-search-status dialog-search-status-error",children:X(t.error)}),s.jsx("button",{type:"button",className:"dialog-search-retry",onClick:()=>e.retry(),children:"Retry"})]});case b.SearchStatus.EMPTY:return s.jsxs("p",{role:"status",className:"dialog-search-status",children:["No products match “",o==null?void 0:o.query,"”."]});case b.SearchStatus.SUCCESS:return o===void 0?null:s.jsxs(s.Fragment,{children:[s.jsxs("p",{role:"status",className:"dialog-search-status",children:[o.nbHits," result",o.nbHits>1?"s":""]}),s.jsx("ul",{className:"dialog-search-results",children:o.hits.map((i,l)=>s.jsx(k,{controller:e,hit:i,index:l,locale:r},i.objectID))}),s.jsx(N,{controller:e,state:t})]});default:return null}},U=({controller:e,state:t,locale:r})=>{const o=t.status!==b.SearchStatus.IDLE,{anchorRef:i,rect:l,viewportHeight:c}=K(o),{isOpen:n,panelRef:a}=$(t,i);return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:i}),n&&l!==void 0&&j(l,c)&&P.createPortal(s.jsx("div",{ref:a,className:"dialog-search-panel",style:W(l,c),children:Q(e,t,r)}),document.body)]})},z={status:b.SearchStatus.IDLE,query:"",page:0},G=e=>{const t=d.useRef(e);t.current=e;const r=d.useRef(void 0),o=d.useCallback(()=>{if(r.current===void 0){const{client:a,surface:h="search_page",locale:S=a.locale,...u}=t.current;r.current=b.createSearchController({search:(p,g)=>a.search(p,g),locale:S,analytics:{surface:h,trackViewSearchResults:p=>a.trackViewSearchResults(p),trackSelectSearchResult:p=>a.trackSelectSearchResult(p)},...u})}return r.current},[]),i=d.useRef(void 0);i.current??(i.current={setQuery:a=>o().setQuery(a),submit:a=>o().submit(a),setPage:a=>o().setPage(a),retry:()=>o().retry(),observeResult:(a,h)=>o().observeResult(a,h),selectResult:(a,h)=>o().selectResult(a,h),subscribe:a=>o().subscribe(a),getState:()=>o().getState(),dispose:()=>{var a;(a=r.current)==null||a.dispose(),r.current=void 0}}),d.useEffect(()=>{b.registerDialogInstallation({method:"react",version:"2.4.0"});const a=o();return()=>{a.dispose(),r.current===a&&(r.current=void 0)}},[o]);const l=d.useCallback(a=>o().subscribe(a),[o]),c=d.useCallback(()=>o().getState(),[o]),n=d.useSyncExternalStore(l,c,()=>z);return{controller:i.current,state:n}};f.DialogInput=y,f.DialogProductBlock=F,f.DialogSearchBar=q,f.DialogSearchPagination=N,f.DialogSearchProductCard=k,f.DialogSearchResults=U,f.useDialogSearch=G,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));
+(function(b,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("react/jsx-runtime"),require("react"),require("@askdialog/dialog-sdk"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@askdialog/dialog-sdk","react-dom"],s):(b=typeof globalThis<"u"?globalThis:b||self,s(b["dialog-react"]={},b["react/jsx-runtime"],b.React,b.dialogSdk,b.ReactDOM))})(this,(function(b,s,u,v,H){"use strict";const B=({title:e="Your expert",description:t="A question about this product?"})=>s.jsxs("div",{className:"dialog-block-header-container",children:[s.jsx("div",{className:"dialog-block-title",children:e}),s.jsx("div",{className:"dialog-block-description",children:t})]}),F=({color:e="#181825"})=>s.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[s.jsxs("g",{clipPath:"url(#clip0_466_934)",children:[s.jsx("path",{d:"M5.41675 10.8333L6.07046 12.1408C6.2917 12.5832 6.40232 12.8045 6.55011 12.9962C6.68124 13.1663 6.83375 13.3188 7.00388 13.45C7.19559 13.5977 7.41684 13.7084 7.85932 13.9296L9.16675 14.5833L7.85932 15.237C7.41684 15.4583 7.19559 15.5689 7.00388 15.7167C6.83375 15.8478 6.68124 16.0003 6.55011 16.1704C6.40232 16.3622 6.2917 16.5834 6.07046 17.0259L5.41675 18.3333L4.76303 17.0259C4.54179 16.5834 4.43117 16.3622 4.28339 16.1704C4.15225 16.0003 3.99974 15.8478 3.82962 15.7167C3.6379 15.5689 3.41666 15.4583 2.97418 15.237L1.66675 14.5833L2.97418 13.9296C3.41666 13.7084 3.6379 13.5977 3.82962 13.45C3.99974 13.3188 4.15225 13.1663 4.28339 12.9962C4.43117 12.8045 4.54179 12.5832 4.76303 12.1408L5.41675 10.8333Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),s.jsx("path",{d:"M12.5001 1.66666L13.4823 4.22034C13.7173 4.83136 13.8348 5.13688 14.0175 5.39386C14.1795 5.62162 14.3785 5.82061 14.6062 5.98256C14.8632 6.16529 15.1687 6.2828 15.7797 6.5178L18.3334 7.49999L15.7797 8.48217C15.1687 8.71718 14.8632 8.83469 14.6062 9.01742C14.3785 9.17937 14.1795 9.37836 14.0175 9.60612C13.8348 9.8631 13.7173 10.1686 13.4823 10.7796L12.5001 13.3333L11.5179 10.7796C11.2829 10.1686 11.1654 9.8631 10.9827 9.60612C10.8207 9.37836 10.6217 9.17937 10.3939 9.01742C10.137 8.83469 9.83145 8.71718 9.22043 8.48217L6.66675 7.49999L9.22043 6.5178C9.83145 6.28279 10.137 6.16529 10.3939 5.98256C10.6217 5.82061 10.8207 5.62162 10.9827 5.39386C11.1654 5.13688 11.2829 4.83136 11.5179 4.22034L12.5001 1.66666Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),s.jsx("defs",{children:s.jsx("clipPath",{id:"clip0_466_934",children:s.jsx("rect",{width:"20",height:"20",fill:"white"})})})]}),q=({client:e,questions:t,productId:o,productTitle:r,selectedVariantId:n})=>{const l=i=>{e.sendProductMessage({productId:o,productTitle:r,selectedVariantId:n,question:i,fromQuestionSuggestion:!0})};return s.jsx(s.Fragment,{children:t.map(i=>s.jsxs("button",{className:"dialog-block-suggestions-item",onClick:()=>l(i.question),children:[s.jsx(F,{color:e.theme.primaryColor}),s.jsx("span",{className:"dialog-block-suggestions-item-label",children:i.question})]},i.question))})},V=()=>s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"})]}),K=({client:e,questions:t,isLoading:o,productId:r,productTitle:n,selectedVariantId:l})=>s.jsx("div",{className:"dialog-block-suggestions-container",children:o||!t?s.jsx(V,{}):s.jsx(q,{client:e,questions:t,productId:r,productTitle:n,selectedVariantId:l})}),j=({color:e="#ffffff"})=>s.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:s.jsx("path",{d:"M10 16.6667V3.33334M10 3.33334L5 8.33334M10 3.33334L15 8.33334",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),N=({client:e,placeholder:t="Ask anything...",productId:o,productTitle:r,selectedVariantId:n})=>{const l=u.useRef(null),[i,a]=u.useState(""),c=()=>{var d;(d=l.current)==null||d.focus()},h=()=>{const d=i;d.trim()&&(e.sendProductMessage({productId:o,productTitle:r,selectedVariantId:n,question:d,fromQuestionSuggestion:!0}),a(""))},f=d=>{d.key==="Enter"&&h()};return s.jsxs("div",{className:"dialog-input-wrapper",onClick:c,children:[s.jsx("input",{id:"dialog-ask-anything-input-ai-input",ref:l,value:i,onChange:d=>a(d.target.value),className:"dialog-ask-anything-input-ai-input",placeholder:t,onKeyDown:f}),s.jsx("button",{id:"send-message-button-ai-input",className:"dialog-input-submit",disabled:!i.trim(),onClick:h,children:s.jsx(j,{color:e.theme.ctaTextColor})})]})},k=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase(),z=e=>{if(!e)return;const t=document.body;Object.keys(e).forEach(o=>{const r=o,n=k(o);if(e[r]!==void 0){if(typeof e[r]=="object"){Object.keys(e[r]).forEach(l=>{var a;const i=l;if(i!==void 0){const c=k(l),h=e[r];t.style.setProperty(`--dialog-theme-${n}-${c}`,(a=h[i])==null?void 0:a.toString())}});return}if(r==="ctaBorderType"){const l=e[r]==="rounded"?"24px":"0";t.style.setProperty(`--dialog-theme-${n}`,l);return}t.style.setProperty(`--dialog-theme-${n}`,e[r].toString())}})},U=({theme:e,children:t})=>(u.useEffect(()=>{e&&z(e)},[e]),s.jsx(s.Fragment,{children:t})),W=({client:e,productId:t,productTitle:o,selectedVariantId:r,enableInput:n=!0})=>{const[l,i]=u.useState(!0),[a,c]=u.useState(void 0);u.useEffect(()=>{v.registerDialogInstallation({method:"react",version:"2.6.0"}),v.addAuditCapability("pdp-block")},[]);const h=u.useMemo(()=>l?"":a==null?void 0:a.assistantName,[a,l]),f=u.useMemo(()=>l?"":a==null?void 0:a.description,[a,l]),d=u.useMemo(()=>l?"":a==null?void 0:a.inputPlaceholder,[a,l]),p=u.useMemo(()=>{var g;return v.resolveTextDirection((g=e.getLocalizationInformations())==null?void 0:g.languageCode)},[e]);return u.useEffect(()=>{let g=!0;return(async()=>{i(!0),c(void 0);try{const m=await e.getSuggestions(t);g&&c(m)}catch(m){console.error("error",m)}finally{g&&i(!1)}})(),()=>{g=!1}},[e,t]),s.jsx(U,{theme:e.theme,children:s.jsxs("div",{id:"dialog-instant",className:"dialog-block-container",dir:p,children:[s.jsx(B,{title:h,description:f}),s.jsx(K,{client:e,questions:a==null?void 0:a.questions,isLoading:l,productId:t,productTitle:o,selectedVariantId:r}),n&&s.jsx(N,{client:e,placeholder:d,productId:t,productTitle:o,selectedVariantId:r})]})})},Q=()=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:"M8 13V3M8 3L3 8M8 3L13 8",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),Z="M5.3217 0.588255C5.63241 -0.196084 6.36759 -0.196085 6.6783 0.588254C6.98901 1.37259 7.68193 2.82807 8.42693 3.57307C9.17193 4.31807 10.6274 5.01099 11.4117 5.3217C12.1961 5.63241 12.1961 6.36759 11.4117 6.6783C10.6274 6.98901 9.17193 7.68193 8.42693 8.42693C7.68193 9.17193 6.98901 10.6274 6.6783 11.4117C6.36759 12.1961 5.63241 12.1961 5.3217 11.4117C5.01099 10.6274 4.31807 9.17193 3.57307 8.42693C2.82808 7.68193 1.37259 6.98901 0.588255 6.6783C-0.196084 6.36759 -0.196085 5.63241 0.588254 5.3217C1.37259 5.01099 2.82807 4.31807 3.57307 3.57307C4.31807 2.82808 5.01099 1.37259 5.3217 0.588255Z",X=({color:e="currentColor"})=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:Z,fill:e})}),G=({controller:e,placeholder:t="Search products...",autoFocus:o=!1,submitAriaLabel:r="Search"})=>{const[n,l]=u.useState(""),i=a=>{a.preventDefault(),e.submit(n)};return s.jsxs("form",{className:"dialog-search-bar",role:"search",onSubmit:i,children:[s.jsxs("div",{className:"dialog-search-bar-field",children:[s.jsx("span",{className:"dialog-search-bar-icon",children:s.jsx(X,{})}),s.jsx("input",{type:"text",name:"dialog-search-query",className:"dialog-search-bar-input",value:n,"aria-label":t,placeholder:t,autoFocus:o,onChange:a=>{l(a.target.value),e.setQuery(a.target.value)}})]}),s.jsx("button",{type:"submit",className:"dialog-search-bar-submit","aria-label":r,children:s.jsx(Q,{})})]})},Y=(e,t)=>{try{return new Intl.NumberFormat(t).format(e)}catch{return String(e)}},P={en:e=>({searching:t=>`Searching “${t}”…`,noResults:"No matching products",retry:"Retry",collectionsLabel:"Collections",productsLabel:"Products",collectionsCount:t=>t===1?"1 collection":`${e(t)} collections`,resultsCount:t=>t===1?"1 result":`${e(t)} results`,seeAllLabel:t=>t===1?"See the result":`See all ${e(t)} results`,previous:"Previous",next:"Next",pageOf:(t,o)=>`Page ${e(t)} / ${e(o)}`}),fr:e=>({searching:t=>`Recherche de « ${t} »…`,noResults:"Aucun produit correspondant",retry:"Réessayer",collectionsLabel:"Collections",productsLabel:"Produits",collectionsCount:t=>t===1?"1 collection":`${e(t)} collections`,resultsCount:t=>t===1?"1 résultat":`${e(t)} résultats`,seeAllLabel:t=>t===1?"Voir le résultat":`Voir les ${e(t)} résultats`,previous:"Précédent",next:"Suivant",pageOf:(t,o)=>`Page ${e(t)} / ${e(o)}`}),de:e=>({searching:t=>`Suche nach „${t}“…`,noResults:"Keine passenden Produkte",retry:"Erneut versuchen",collectionsLabel:"Kollektionen",productsLabel:"Produkte",collectionsCount:t=>t===1?"1 Kollektion":`${e(t)} Kollektionen`,resultsCount:t=>t===1?"1 Ergebnis":`${e(t)} Ergebnisse`,seeAllLabel:t=>t===1?"Das Ergebnis anzeigen":`Alle ${e(t)} Ergebnisse anzeigen`,previous:"Zurück",next:"Weiter",pageOf:(t,o)=>`Seite ${e(t)} / ${e(o)}`}),es:e=>({searching:t=>`Buscando «${t}»…`,noResults:"No hay productos que coincidan",retry:"Reintentar",collectionsLabel:"Colecciones",productsLabel:"Productos",collectionsCount:t=>t===1?"1 colección":`${e(t)} colecciones`,resultsCount:t=>t===1?"1 resultado":`${e(t)} resultados`,seeAllLabel:t=>t===1?"Ver el resultado":`Ver los ${e(t)} resultados`,previous:"Anterior",next:"Siguiente",pageOf:(t,o)=>`Página ${e(t)} / ${e(o)}`}),it:e=>({searching:t=>`Ricerca di “${t}”…`,noResults:"Nessun prodotto corrispondente",retry:"Riprova",collectionsLabel:"Collezioni",productsLabel:"Prodotti",collectionsCount:t=>t===1?"1 collezione":`${e(t)} collezioni`,resultsCount:t=>t===1?"1 risultato":`${e(t)} risultati`,seeAllLabel:t=>t===1?"Vedi il risultato":`Vedi tutti i ${e(t)} risultati`,previous:"Precedente",next:"Successivo",pageOf:(t,o)=>`Pagina ${e(t)} / ${e(o)}`})},E=e=>{var r;const t=((r=e==null?void 0:e.split("-")[0])==null?void 0:r.toLowerCase())??"en";return(P[t]??P.en)(n=>Y(n,e))},A=e=>e.status!==v.SearchStatus.LOADING&&e.response!==void 0&&e.response.nbPages>1,x=({controller:e,state:t,locale:o})=>{const r=t.response;if(r===void 0||!A(t))return null;const n=E(o);return s.jsxs("nav",{"aria-label":"Search results pages",className:"dialog-search-pagination",children:[s.jsx("button",{type:"button",disabled:r.page===0,onClick:()=>e.setPage(r.page-1),children:n.previous}),s.jsx("span",{children:n.pageOf(r.page+1,r.nbPages)}),s.jsx("button",{type:"button",disabled:r.page>=r.nbPages-1,onClick:()=>e.setPage(r.page+1),children:n.next})]})},$=e=>e.normalize("NFD").replace(new RegExp("\\p{M}","gu"),"").replace(/ẞ/gu,"ß").toUpperCase().toLowerCase().replace(/ς/g,"σ"),J=(e,t)=>{const o={before:"",match:e,after:""},r=$(t.trim());if(r==="")return o;const n=[...e],l=[];let i="";n.forEach((f,d)=>{const p=$(f);for(let g=0;g<p.length;g+=1)l.push(d);i+=p});const a=i.indexOf(r);if(a===-1)return o;const c=l[a],h=l[a+r.length-1]+1;return{before:n.slice(0,c).join(""),match:n.slice(c,h).join(""),after:n.slice(h).join("")}},D=({title:e,query:t})=>{const{before:o,match:r,after:n}=J(e,t);return s.jsxs(s.Fragment,{children:[o!==""&&s.jsx("span",{className:"dialog-search-muted",children:o}),s.jsx("span",{className:"dialog-search-match",children:r}),n!==""&&s.jsx("span",{className:"dialog-search-muted",children:n})]})},R=({amount:e,currencyCode:t},o)=>t===void 0?new Intl.NumberFormat(o).format(Number(e)):new Intl.NumberFormat(o,{style:"currency",currency:t}).format(Number(e)),ee=(e,t)=>{if(e===void 0)return"";try{return R(e.min,t)}catch{return""}},te=e=>{try{const{protocol:t}=new URL(e,window.location.href);return t==="http:"||t==="https:"?e:void 0}catch{return}},M=e=>e.url===void 0||e.url===""?void 0:te(e.url),I=e=>e.title??e.handle??e.objectID,T=({controller:e,hit:t,index:o,locale:r,query:n=""})=>{const l=u.useRef(null);u.useEffect(()=>{l.current!==null&&e.observeResult(l.current,o)},[e,t,o]);const i=d=>{const p=d.metaKey||d.ctrlKey||d.shiftKey||d.altKey;e.selectResult(o,{navigate:!p})&&d.preventDefault()},a=d=>{d.button===1&&e.selectResult(o,{navigate:!1})},c=ee(t.priceRange,r),h=M(t),f=s.jsxs(s.Fragment,{children:[s.jsx("span",{className:"dialog-search-product-thumb","aria-hidden":!0,children:t.imageUrl!==void 0&&t.imageUrl!==""&&s.jsx("img",{src:t.imageUrl,alt:"",loading:"lazy"})}),s.jsx("span",{className:"dialog-search-product-title",children:s.jsx(D,{title:I(t),query:n})}),c!==""&&s.jsx("span",{className:"dialog-search-product-price",children:c})]});return s.jsx("li",{ref:l,className:"dialog-search-card",children:h===void 0?s.jsx("div",{className:"dialog-search-product",children:f}):s.jsx("a",{className:"dialog-search-product",href:h,onClick:i,onAuxClick:a,children:f})})},se=()=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 256 256",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:"M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66Z"})}),re=()=>s.jsx("svg",{width:12,height:12,viewBox:"0 0 256 256",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:"M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z"})}),O=e=>(e??[]).flatMap(t=>{const o=M(t);return o===void 0?[]:[{collection:t,href:o}]}),oe=({collections:e,query:t,messages:o})=>{const r=O(e);return r.length===0?null:s.jsxs("aside",{className:"dialog-search-collections",children:[s.jsxs("div",{className:"dialog-search-section-head",children:[s.jsx("p",{className:"dialog-search-label",children:o.collectionsLabel}),s.jsx("span",{className:"dialog-search-count",children:o.collectionsCount(r.length)})]}),s.jsx("ul",{className:"dialog-search-collection-list",children:r.map(({collection:n,href:l})=>s.jsx("li",{children:s.jsxs("a",{className:"dialog-search-collection",href:l,children:[s.jsx("span",{className:"dialog-search-collection-thumb","aria-hidden":!0,children:n.imageUrl!==void 0&&n.imageUrl!==""&&s.jsx("img",{src:n.imageUrl,alt:"",loading:"lazy"})}),s.jsx("span",{className:"dialog-search-collection-title",children:s.jsx(D,{title:I(n),query:t})}),s.jsx("span",{className:"dialog-search-caret",children:s.jsx(re,{})})]})},n.objectID))})]})},ne=({controller:e,response:t,locale:o,messages:r})=>s.jsxs("section",{className:"dialog-search-products",children:[s.jsx("div",{className:"dialog-search-section-head",children:s.jsxs("p",{className:"dialog-search-label",children:[r.productsLabel,t.nbHits>0&&s.jsx("span",{className:"dialog-search-label-count",children:` · ${r.resultsCount(t.nbHits)}`})]})}),s.jsx("ul",{className:"dialog-search-results",children:t.hits.length===0?s.jsx("li",{className:"dialog-search-empty",role:"status",children:r.noResults}):t.hits.map((n,l)=>s.jsx(T,{controller:e,hit:n,index:l,locale:o,query:t.query},n.objectID))})]}),y=8,C=16,ae=200,ce=1440,le=(e,t)=>e.bottom>0&&e.top<t,ie=(e,t)=>{const o=Math.min(ce,t-2*C),r=e.left+e.width/2-o/2;return{left:Math.min(Math.max(r,C),t-C-o),width:o}},de=(e,t,o)=>{const r=o-e.bottom-y-C,n=e.top-y-C,l=ie(e,t);return r<ae&&n>r?{...l,bottom:o-e.top+y,maxHeight:Math.max(n,0)}:{...l,top:e.bottom+y,maxHeight:Math.max(r,0)}},ue=e=>{const t=e.trim().replace(/^#/,"");if(!/^(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t))return;const o=t.length<=4?[...t].map(r=>r+r).join(""):t;return[0,2,4].map(r=>Number.parseInt(o.slice(r,r+2),16))},he=e=>{const t=/^rgba?\((\d+), (\d+), (\d+)(?:, [\d.]+)?\)$/.exec(e);if(t!==null)return[t[1],t[2],t[3]].map(Number)},ge=e=>{if(typeof document>"u")return;const t=document.createElement("span");if(t.style.color=e,t.style.color==="")return;document.body.appendChild(t);const o=he(getComputedStyle(t).color);return t.remove(),o},fe=e=>ue(e)??ge(e),pe=e=>{const t=e/255;return t<=.03928?t/12.92:((t+.055)/1.055)**2.4},_=e=>{const t=fe(e);if(t===void 0)return;const[o,r,n]=t.map(pe);return .2126*o+.7152*r+.0722*n},be="#181825",ve="#ffffff",Ce="straight",w=.5,L={light:{panel:"#ffffff",side:"#fafbfc",text:"#111827","text-sec":"#6b7280",border:"#eceef2",hover:"#eef2f7",thumb:"#eef1f5"},dark:{panel:"#15171c",side:"#1b1e25",text:"#f3f4f6","text-sec":"#9ca3af",border:"#2b2f38",hover:"#242830",thumb:"#2b2f38"}},ye={rectangle:{"r-panel":"4px","r-item":"4px","r-thumb":"2px","r-btn":"4px"},"rectangle-rounded":{"r-panel":"16px","r-item":"10px","r-thumb":"8px","r-btn":"10px"}},S=e=>e===void 0||e.trim()===""?void 0:e.trim(),Se=e=>{const t=e===void 0?void 0:_(e);return t===void 0?"light":t<w?"dark":"light"},we=(e,t)=>{const o=_(e);return o===void 0?L[t].text:(t==="light"?o<w:o>=w)?e:L[t].text},Le=e=>{const t=Se(S(e==null?void 0:e.backgroundColor)),o=(e==null?void 0:e.ctaBorderType)===Ce?"rectangle":"rectangle-rounded",r=S(e==null?void 0:e.primaryColor)??be,n=S(e==null?void 0:e.fontFamily),l={...L[t],...ye[o],primary:r,accent:we(r,t),"cta-text":S(e==null?void 0:e.ctaTextColor)??ve,...n===void 0?{}:{font:n}};return Object.fromEntries(Object.entries(l).map(([i,a])=>[`--dso-${i}`,a]))},me=e=>{const t=u.useRef(null),[o,r]=u.useState(void 0),[n,l]=u.useState({width:0,height:0});return u.useLayoutEffect(()=>{if(!e)return;const i=()=>{const a=t.current;if(a===null)return;const c=a.previousElementSibling??a,{top:h,bottom:f,left:d,width:p}=c.getBoundingClientRect();l(g=>g.width===window.innerWidth&&g.height===window.innerHeight?g:{width:window.innerWidth,height:window.innerHeight}),r(g=>g!==void 0&&g.top===h&&g.bottom===f&&g.left===d&&g.width===p?g:{top:h,bottom:f,left:d,width:p})};return i(),window.addEventListener("scroll",i,!0),window.addEventListener("resize",i),()=>{window.removeEventListener("scroll",i,!0),window.removeEventListener("resize",i)}},[e]),{anchorRef:t,rect:o,viewport:n}},Ne=(e,t)=>{const[o,r]=u.useState(!1),n=u.useRef(null),l=e.status!==v.SearchStatus.IDLE&&!o;return u.useEffect(()=>{r(!1)},[e.query]),u.useEffect(()=>{if(!l)return;const i=a=>{var p,g;const c=a.target;if(!(c instanceof Node))return;const h=(p=t.current)==null?void 0:p.previousElementSibling,f=((g=n.current)==null?void 0:g.contains(c))??!1,d=(h==null?void 0:h.contains(c))??!1;!f&&!d&&r(!0)};return document.addEventListener("pointerdown",i),()=>document.removeEventListener("pointerdown",i)},[l,t]),u.useEffect(()=>{var c;const i=(c=t.current)==null?void 0:c.previousElementSibling;if(i==null)return;const a=()=>r(!1);return i.addEventListener("focusin",a),()=>i.removeEventListener("focusin",a)},[t]),{isOpen:l,panelRef:n}},ke=e=>e instanceof v.DialogSearchError?`Search failed (${e.status}${e.code?` ${e.code}`:""}): ${e.message}`:"Search failed: network error. Check your connection and try again.",Pe=(e,t)=>{var p,g;const{controller:o,state:r,locale:n,seeAllHref:l}=e,{status:i,response:a}=r;if(i===v.SearchStatus.ERROR)return s.jsxs("div",{className:"dialog-search-error",children:[s.jsx("p",{role:"alert",className:"dialog-search-status dialog-search-status-error",children:ke(r.error)}),s.jsx("button",{type:"button",className:"dialog-search-retry",onClick:()=>o.retry(),children:t.retry})]});if(a===void 0)return s.jsx("p",{role:"status",className:"dialog-search-status",children:t.searching(r.query)});const c=((g=(p=r.sections)==null?void 0:p.collections)==null?void 0:g.hits)??[],h=O(c).length>0,f=l!==void 0&&a.nbHits>0,d=!f&&A(r);return s.jsxs(s.Fragment,{children:[s.jsxs("div",{className:`dialog-search-body${h?"":" dialog-search-body--no-collections"}`,children:[s.jsx(oe,{collections:c,query:a.query,messages:t}),s.jsx(ne,{controller:o,response:a,locale:n,messages:t})]}),(f||d)&&s.jsx("div",{className:"dialog-search-footer",children:f?s.jsxs("a",{className:"dialog-search-cta",href:l(a.query),children:[t.seeAllLabel(a.nbHits),s.jsx(se,{})]}):s.jsx(x,{controller:o,state:r,locale:n})})]})},Ee=e=>{const{state:t,locale:o,theme:r,layout:n="list"}=e,l=t.status!==v.SearchStatus.IDLE,{anchorRef:i,rect:a,viewport:c}=me(l),{isOpen:h,panelRef:f}=Ne(t,i),d=E(o),p=u.useMemo(()=>Le(r),[r]);return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:i}),h&&a!==void 0&&le(a,c.height)&&H.createPortal(s.jsx("div",{ref:f,className:`dialog-search-panel dialog-search-panel--${n}`,style:{...de(a,c.width,c.height),...p},children:Pe(e,d)}),document.body)]})},Ae={status:v.SearchStatus.IDLE,query:"",page:0},xe=e=>{const t=u.useRef(e);t.current=e;const o=u.useRef(void 0),r=u.useCallback(()=>{if(o.current===void 0){const{client:c,surface:h="search_page",...f}=t.current;o.current=v.createSearchController({search:(d,p)=>c.search(d,p),analytics:{surface:h,trackViewSearchResults:d=>c.trackViewSearchResults(d),trackSelectSearchResult:d=>c.trackSelectSearchResult(d)},...f})}return o.current},[]),n=u.useRef(void 0);n.current??(n.current={setQuery:c=>r().setQuery(c),submit:c=>r().submit(c),setPage:c=>r().setPage(c),retry:()=>r().retry(),observeResult:(c,h)=>r().observeResult(c,h),selectResult:(c,h)=>r().selectResult(c,h),subscribe:c=>r().subscribe(c),getState:()=>r().getState(),dispose:()=>{var c;(c=o.current)==null||c.dispose(),o.current=void 0}}),u.useEffect(()=>{v.registerDialogInstallation({method:"react",version:"2.6.0"});const c=r();return()=>{c.dispose(),o.current===c&&(o.current=void 0)}},[r]);const l=u.useCallback(c=>r().subscribe(c),[r]),i=u.useCallback(()=>r().getState(),[r]),a=u.useSyncExternalStore(l,i,()=>Ae);return{controller:n.current,state:a,theme:e.client.theme}};b.DialogInput=N,b.DialogProductBlock=W,b.DialogSearchBar=G,b.DialogSearchPagination=x,b.DialogSearchProductCard=T,b.DialogSearchResults=Ee,b.useDialogSearch=xe,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})}));

package/dist/icons/ArrowRightIcon.d.ts

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const ArrowRightIcon: FC;

package/dist/icons/CaretRightIcon.d.ts

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const CaretRightIcon: FC;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@askdialog/dialog-react",
-  "version": "2.4.0",
+  "version": "2.6.0",
   "private": false,
   "type": "module",
   "main": "./dist/dialog-react.umd.js",
@@ -26,7 +26,7 @@
   "devDependencies": {
     "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.3",
-    "@askdialog/dialog-sdk": "2.10.0"
+    "@askdialog/dialog-sdk": "2.13.0"
   },
   "author": "Dialog",
   "publishConfig": {