@anker-in/headless-ui 1.1.21 → 1.1.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/dist/cjs/biz-components/FooterNavigation/icons/Country.js +1 -1
  2. package/dist/cjs/biz-components/FooterNavigation/icons/Country.js.map +2 -2
  3. package/dist/cjs/biz-components/FooterNavigation/index.js +1 -1
  4. package/dist/cjs/biz-components/FooterNavigation/index.js.map +3 -3
  5. package/dist/cjs/biz-components/HeaderNavigation/index.js +1 -1
  6. package/dist/cjs/biz-components/HeaderNavigation/index.js.map +2 -2
  7. package/dist/cjs/biz-components/NavigationSearch/index.js +2 -2
  8. package/dist/cjs/biz-components/NavigationSearch/index.js.map +3 -3
  9. package/dist/cjs/biz-components/SearchPage/index.d.ts +1 -1
  10. package/dist/cjs/biz-components/SearchPage/index.js +1 -1
  11. package/dist/cjs/biz-components/SearchPage/index.js.map +3 -3
  12. package/dist/cjs/biz-components/SearchPage/types.d.ts +3 -0
  13. package/dist/cjs/biz-components/SearchPage/types.js +1 -1
  14. package/dist/cjs/biz-components/SearchPage/types.js.map +2 -2
  15. package/dist/cjs/biz-components/Specs/dropdown.d.ts +1 -2
  16. package/dist/cjs/biz-components/Specs/dropdown.js +2 -2
  17. package/dist/cjs/biz-components/Specs/dropdown.js.map +3 -3
  18. package/dist/cjs/biz-components/Specs/index.js +1 -1
  19. package/dist/cjs/biz-components/Specs/index.js.map +3 -3
  20. package/dist/cjs/biz-components/Subscribe/index.js +2 -2
  21. package/dist/cjs/biz-components/Subscribe/index.js.map +3 -3
  22. package/dist/cjs/helpers/utils.d.ts +6 -0
  23. package/dist/cjs/helpers/utils.js +1 -1
  24. package/dist/cjs/helpers/utils.js.map +3 -3
  25. package/dist/esm/biz-components/FooterNavigation/icons/Country.js +1 -1
  26. package/dist/esm/biz-components/FooterNavigation/icons/Country.js.map +2 -2
  27. package/dist/esm/biz-components/FooterNavigation/index.js +1 -1
  28. package/dist/esm/biz-components/FooterNavigation/index.js.map +3 -3
  29. package/dist/esm/biz-components/HeaderNavigation/index.js +1 -1
  30. package/dist/esm/biz-components/HeaderNavigation/index.js.map +2 -2
  31. package/dist/esm/biz-components/NavigationSearch/index.js +2 -2
  32. package/dist/esm/biz-components/NavigationSearch/index.js.map +3 -3
  33. package/dist/esm/biz-components/SearchPage/index.d.ts +1 -1
  34. package/dist/esm/biz-components/SearchPage/index.js +1 -1
  35. package/dist/esm/biz-components/SearchPage/index.js.map +3 -3
  36. package/dist/esm/biz-components/SearchPage/types.d.ts +3 -0
  37. package/dist/esm/biz-components/SearchPage/types.js +1 -1
  38. package/dist/esm/biz-components/SearchPage/types.js.map +2 -2
  39. package/dist/esm/biz-components/Specs/dropdown.d.ts +1 -2
  40. package/dist/esm/biz-components/Specs/dropdown.js +2 -2
  41. package/dist/esm/biz-components/Specs/dropdown.js.map +3 -3
  42. package/dist/esm/biz-components/Specs/index.js +1 -1
  43. package/dist/esm/biz-components/Specs/index.js.map +3 -3
  44. package/dist/esm/biz-components/Subscribe/index.js +2 -2
  45. package/dist/esm/biz-components/Subscribe/index.js.map +3 -3
  46. package/dist/esm/helpers/utils.d.ts +6 -0
  47. package/dist/esm/helpers/utils.js +1 -1
  48. package/dist/esm/helpers/utils.js.map +3 -3
  49. package/package.json +1 -1
package/dist/cjs/biz-components/NavigationSearch/index.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var b=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var q=Object.prototype.hasOwnProperty;var z=(t,s)=>{for(var r in s)b(t,r,{get:s[r],enumerable:!0})},G=(t,s,r,i)=>{if(s&&typeof s=="object"||typeof s=="function")for(let l of W(s))!q.call(t,l)&&l!==r&&b(t,l,{get:()=>s[l],enumerable:!(i=_(s,l))||i.enumerable});return t};var K=t=>G(b({},"__esModule",{value:!0}),t);var M={};z(M,{canSearch:()=>$,default:()=>H});module.exports=K(M);var e=require("react/jsx-runtime"),a=require("../../components/index.js"),h=require("../HeaderNavigation/icons/index.js"),p=require("react"),C=require("../AiuiProvider/index.js"),g=require("./types.js"),L=require("es-toolkit"),c=require("../../helpers/utils.js");const $=t=>!(t.metafields?.global?.HideSearch||t.metafields?.seo?.hidden||t.metafields?.seo?.setting?.noindex),y=(0,p.forwardRef)(({data:t,onSearch:s,onClose:r,searchResult:i,isSearching:l,keywords:m},D)=>{const{locale:d="us",copyWriting:V}=(0,C.useAiuiContext)(),[n,F]=(0,p.useState)(""),[f,N]=(0,p.useState)(!1),S=(0,L.debounce)(o=>{s(o)},300),P=(0,p.useCallback)(o=>{o.key==="Enter"&&!f&&window.open(`${d==="us"?"":d}${t?.moreLink}?q=${n.toLowerCase()}`,"_self")},[f,n,d,t?.moreLink]),E=(0,p.useMemo)(()=>Array.isArray(m)&&m?.length?m.map(o=>o.search_term):Array.isArray(t?.popularWords)&&t?.popularWords?.length?t?.popularWords.map(o=>o.popularWord):[],[m,t?.popularWords]),I=(0,p.useCallback)(o=>{switch(o.__typename||o.type){case"Product":return`/products${o.path}?q=${n.toLowerCase()}`;case"Article":return`/blogs/${o.blog.handle}/${o.handle.replace("storefront-","")}?q=${n.toLowerCase()}`;default:break}},[n]),k=(0,p.useMemo)(()=>{if(n){if(i?.totalCount)return g.SearchStatus.Predict;if(!l)return g.SearchStatus.Empty}else return g.SearchStatus.Default},[i?.totalCount,n,l]);return(0,e.jsxs)(a.Container,{childClassName:"!bg-white",className:"relative",ref:D,children:[(0,e.jsx)("style",{children:`
1
+ "use strict";var b=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var q=Object.prototype.hasOwnProperty;var G=(t,s)=>{for(var l in s)b(t,l,{get:s[l],enumerable:!0})},H=(t,s,l,r)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of W(s))!q.call(t,n)&&n!==l&&b(t,n,{get:()=>s[n],enumerable:!(r=z(s,n))||r.enumerable});return t};var K=t=>H(b({},"__esModule",{value:!0}),t);var V={};G(V,{canSearch:()=>D,default:()=>M});module.exports=K(V);var e=require("react/jsx-runtime"),a=require("../../components/index.js"),h=require("../HeaderNavigation/icons/index.js"),i=require("react"),C=require("../AiuiProvider/index.js"),g=require("./types.js"),$=require("es-toolkit"),c=require("../../helpers/utils.js");const D=t=>!(t.metafields?.global?.HideSearch||t.metafields?.seo?.hidden||t.metafields?.seo?.setting?.noindex),w=(0,i.forwardRef)(({data:t,onSearch:s,onClose:l,searchResult:r,isSearching:n,keywords:m},F)=>{const{locale:d="us",copyWriting:R}=(0,C.useAiuiContext)(),[p,S]=(0,i.useState)(""),[k,y]=(0,i.useState)(!1),v=(0,i.useRef)(null);(0,i.useEffect)(()=>{v.current&&v.current.focus({preventScroll:!0})},[]);const E=(0,$.debounce)(o=>{s(o)},300),P=(0,i.useCallback)(o=>{o.key==="Enter"&&!k&&window.open(`${d==="us"?"":d}${t?.moreLink}?q=${p.toLowerCase()}`,"_self")},[k,p,d,t?.moreLink]),I=(0,i.useMemo)(()=>Array.isArray(m)&&m?.length?m.map(o=>o.search_term):Array.isArray(t?.popularWords)&&t?.popularWords?.length?t?.popularWords.map(o=>o.popularWord):[],[m,t?.popularWords]),T=(0,i.useCallback)(o=>{switch(o.__typename||o.type){case"Product":return`/products${o.path}?q=${p.toLowerCase()}`;case"Article":return`/blogs/${o.blog.handle}/${o.handle.replace("storefront-","")}?q=${p.toLowerCase()}`;default:break}},[p]),N=(0,i.useMemo)(()=>{if(p){if(r?.totalCount)return g.SearchStatus.Predict;if(!n)return g.SearchStatus.Empty}else return g.SearchStatus.Default},[r?.totalCount,p,n]);return(0,e.jsxs)(a.Container,{childClassName:"!bg-white",className:"relative",ref:F,children:[(0,e.jsx)("style",{children:`
2
2
  .navigation-search-component input:-webkit-autofill,
3
3
  .navigation-search-component input:-webkit-autofill:hover,
4
4
  .navigation-search-component input:-webkit-autofill:focus {
@@ -7,5 +7,5 @@
7
7
  transition: background-color 9999s ease-in-out 0s !important;
8
8
  caret-color: #000;
9
9
  }
10
- `}),(0,e.jsxs)("div",{className:"navigation-search-component laptop:h-[52px] desktop:h-[60px] desktop:pt-6 flex items-center justify-between border-b border-b-gray-200 py-4 text-black",children:[(0,e.jsx)("input",{value:n,onCompositionStart:()=>N(!0),onCompositionEnd:()=>N(!1),onKeyDown:P,onChange:o=>{F(o.target.value),o.target.value&&S(o.target.value)},type:"text",className:"basis-[200px] bg-white text-sm font-bold leading-[1.4] outline-none focus-visible:!outline-none ",placeholder:t?.placeholder}),(0,e.jsxs)("div",{className:"flex items-center gap-3",children:[(0,e.jsx)(h.Search,{className:"size-5 cursor-pointer",onClick:()=>s(n)}),(0,e.jsx)("div",{className:"h-[20px] w-px bg-[#E4E5E6]"}),(0,e.jsx)(h.Close,{className:"size-5 cursor-pointer",onClick:r})]})]}),(0,e.jsx)("div",{className:"desktop:gap-12 desktop:py-6 flex flex-col gap-6 py-4 text-black",children:k===g.SearchStatus.Predict?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("div",{children:[(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{html:t?.suggestText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),i?.items?.length>6&&(0,e.jsx)(a.Button,{as:"a",iconClassName:"size-4",href:`${d==="us"?"":d}${t?.moreLink}?q=${n.toLowerCase()}`,className:"!p-0 !text-sm font-bold leading-[1.2]",variant:"link",children:t?.moreText})]}),(0,e.jsx)("div",{className:"mt-2 flex flex-col",children:i?.items?.filter(o=>$(o)).slice(0,6)?.map(o=>(0,e.jsx)(a.Link,{className:"w-full p-4 no-underline hover:bg-[#F5F5F7] hover:text-current",href:I(o),children:(0,e.jsx)(a.Text,{html:(0,c.highlightSearchWord)(o.title,n),className:"cursor-pointer text-sm font-bold leading-[1.4]"})},o.id))})]}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Text,{html:t?.hotProductsText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2",children:[(0,e.jsx)(a.Link,{asChild:!t?.advertisingLink,href:t?.advertisingLink,children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)(a.Picture,{source:t?.advertisingBgImg?.url,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(a.Heading,{size:2,html:t?.advertisingTitle||"Buy in Guide",className:(0,c.cn)("font-bold text-white",{"text-black":t?.advertisingTheme==="dark"})}),(0,e.jsx)(a.Text,{html:t?.advertisingSubtitle||"20.000mAh",className:(0,c.cn)("text-sm font-bold text-white",{"text-black":t?.advertisingTheme==="dark"})})]})]})}),i?.items?.filter(o=>o.type.toLowerCase()==="product").slice(0,7)?.map(o=>{const u=o?.variants?.[0],v=`${u?.image?.url||o?.images?.[0]?.url}`,x=o?.title||o?.name,T=o?.description,A=o?.badge||"",B=`/products/${o?.handle}?variant=${(0,c.atobID)(u?.id)}`;return(0,e.jsx)(w,{productImage:v,productName:x,productDesc:T,productBadge:A,listingLink:B},o.id)})]})]})]}):(0,e.jsxs)(e.Fragment,{children:[k===g.SearchStatus.Empty&&(0,e.jsx)(a.Text,{html:t?.noResultText,as:"p",className:"border-b border-[#E4E5E6] pb-6 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Text,{html:t?.popularText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"mt-2",children:[(0,e.jsx)(j,{data:t,keywords:E,locale:d}),Array.isArray(t?.popularPages)&&!!t?.popularPages?.length&&(0,e.jsx)(a.Grid,{className:"laptop:gap-4 laptop:mt-4 mt-3 gap-3",children:t?.popularPages?.map(o=>(0,e.jsx)(a.GridItem,{className:"tablet:col-span-6 laptop:p-3 desktop:p-4 laptop:col-span-3 col-span-12 p-2 hover:bg-[#F5F5F7]",children:(0,e.jsx)("a",{href:`${d==="us"?"":d}${t?.moreLink}?q=${o?.popularPage.toLowerCase()}`,className:"line-clamp-1 cursor-pointer text-sm font-bold leading-[1.4]",children:o?.popularPage})},o?.id))})]})]}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Text,{html:t?.hotProductsText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2",children:[(0,e.jsx)(a.Link,{asChild:!t?.advertisingLink,href:t?.advertisingLink,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(a.Picture,{source:t?.advertisingBgImg?.url,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(a.Heading,{size:2,html:t?.advertisingTitle||"Buy in Guide",className:"font-bold text-white"}),(0,e.jsx)(a.Text,{html:t?.advertisingSubtitle||"20.000mAh",className:"text-sm font-bold text-white"})]})]})}),t?.hotProducts?.slice(0,7)?.map(o=>{const u=o?.custom_description,v=o?.badge||"",x=`/products/${o?.handle}?variant=${(0,c.atobID)(o?.shopify_id)}`;return(0,e.jsx)(w,{productImage:o?.image,productName:o?.name,productDesc:u,productBadge:v,listingLink:x},o.id)})]})]})]})})]})});y.displayName="NavigationSearch";const w=({productImage:t,productName:s,productDesc:r,productBadge:i,className:l,listingLink:m})=>(0,e.jsx)(a.Link,{href:m,className:"block no-underline hover:text-current",children:(0,e.jsxs)("div",{className:(0,c.cn)("flex shrink-0 gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500",l),children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)(a.Picture,{source:t,width:90,height:90,className:"size-[96px]",imgClassName:"object-contain h-full"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:" h-[24px] ",children:i&&(0,e.jsx)(a.Text,{as:"p",html:i,className:"text-brand-0 mb-1 inline-block h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[24px]"})}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Link,{href:m,className:"no-underline hover:text-current",children:(0,e.jsx)(a.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:s})}),r&&(0,e.jsx)(a.Text,{as:"p",html:r,className:"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]})]})}),j=({data:t,keywords:s,locale:r})=>(0,e.jsx)("div",{className:"laptop:gap-4 flex flex-wrap gap-3",children:s?.map((i,l)=>(0,e.jsx)("a",{href:`${r==="us"?"":r}${t?.moreLink}?q=${i?.toLowerCase()}`,className:"laptop:p-3 desktop:p-4 cursor-pointer p-2 text-sm font-bold leading-[1.4] hover:bg-[#F5F5F7]",children:i},l))});var H=y;
10
+ `}),(0,e.jsxs)("div",{className:"navigation-search-component laptop:h-[52px] desktop:h-[60px] desktop:pt-6 flex items-center justify-between gap-4 border-b border-b-gray-200 py-4 text-black",children:[(0,e.jsx)("input",{ref:v,value:p,onCompositionStart:()=>y(!0),onCompositionEnd:()=>y(!1),onKeyDown:P,onChange:o=>{S(o.target.value),o.target.value&&E(o.target.value)},type:"text",className:"flex-1 bg-white text-sm font-bold leading-[1.4] outline-none focus-visible:!outline-none ",placeholder:t?.placeholder}),(0,e.jsxs)("div",{className:"flex items-center gap-3",children:[(0,e.jsx)(h.Search,{className:"size-5 cursor-pointer",onClick:()=>s(p)}),(0,e.jsx)("div",{className:"h-[20px] w-px bg-[#E4E5E6]"}),(0,e.jsx)(h.Close,{className:"size-5 cursor-pointer",onClick:l})]})]}),(0,e.jsx)("div",{className:"desktop:gap-12 desktop:py-6 flex flex-col gap-6 py-4 text-black",children:N===g.SearchStatus.Predict?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("div",{children:[(0,e.jsxs)("div",{className:"flex items-center gap-1",children:[(0,e.jsx)(a.Text,{html:t?.suggestText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),r?.items?.length>6&&(0,e.jsx)(a.Button,{as:"a",iconClassName:"size-4",href:`${d==="us"?"":d}${t?.moreLink}?q=${p.toLowerCase()}`,className:"!p-0 !text-sm font-bold leading-[1.2]",variant:"link",children:t?.moreText})]}),(0,e.jsx)("div",{className:"mt-2 flex flex-col",children:r?.items?.filter(o=>D(o)).slice(0,6)?.map(o=>(0,e.jsx)(a.Link,{className:"w-full p-4 no-underline hover:bg-[#F5F5F7] hover:text-current",href:T(o),children:(0,e.jsx)(a.Text,{html:(0,c.highlightSearchWord)(o.title,p),className:"cursor-pointer text-sm font-bold leading-[1.4]"})},o.id))})]}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Text,{html:t?.hotProductsText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2",children:[(0,e.jsx)(a.Link,{asChild:!t?.advertisingLink,href:t?.advertisingLink,children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)(a.Picture,{source:t?.advertisingBgImg?.url,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(a.Heading,{size:2,html:t?.advertisingTitle||"Buy in Guide",className:(0,c.cn)("font-bold text-white",{"text-black":t?.advertisingTheme==="dark"})}),(0,e.jsx)(a.Text,{html:t?.advertisingSubtitle||"20.000mAh",className:(0,c.cn)("text-sm font-bold text-white",{"text-black":t?.advertisingTheme==="dark"})})]})]})}),r?.items?.filter(o=>o.type.toLowerCase()==="product").slice(0,7)?.map(o=>{const u=o?.variants?.[0],f=`${u?.image?.url||o?.images?.[0]?.url}`,x=o?.title||o?.name,_=o?.description,A=o?.badge||"",B=`/products/${o?.handle}?variant=${(0,c.atobID)(u?.id)}`;return(0,e.jsx)(L,{productImage:f,productName:x,productDesc:_,productBadge:A,listingLink:B},o.id)})]})]},"predict-advertising-card")]}):(0,e.jsxs)(e.Fragment,{children:[N===g.SearchStatus.Empty&&(0,e.jsx)(a.Text,{html:t?.noResultText,as:"p",className:"border-b border-[#E4E5E6] pb-6 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Text,{html:t?.popularText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"mt-2",children:[(0,e.jsx)(j,{data:t,keywords:I,locale:d}),Array.isArray(t?.popularPages)&&!!t?.popularPages?.length&&(0,e.jsx)(a.Grid,{className:"laptop:gap-4 laptop:mt-4 mt-3 gap-3",children:t?.popularPages?.map(o=>(0,e.jsx)(a.GridItem,{className:"tablet:col-span-6 laptop:p-3 desktop:p-4 laptop:col-span-3 col-span-12 p-2 hover:bg-[#F5F5F7]",children:(0,e.jsx)("a",{href:`${d==="us"?"":d}${t?.moreLink}?q=${o?.popularPage.toLowerCase()}`,className:"line-clamp-1 cursor-pointer text-sm font-bold leading-[1.4]",children:o?.popularPage})},o?.id))})]})]}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Text,{html:t?.hotProductsText,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2",children:[(0,e.jsx)(a.Link,{asChild:!t?.advertisingLink,href:t?.advertisingLink,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(a.Picture,{source:t?.advertisingBgImg?.url,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(a.Heading,{size:2,html:t?.advertisingTitle||"Buy in Guide",className:"font-bold text-white"}),(0,e.jsx)(a.Text,{html:t?.advertisingSubtitle||"20.000mAh",className:"text-sm font-bold text-white"})]})]})}),t?.hotProducts?.slice(0,7)?.map(o=>{const u=o?.custom_description,f=o?.badge||"",x=`/products/${o?.handle}?variant=${(0,c.atobID)(o?.shopify_id)}`;return(0,e.jsx)(L,{productImage:o?.image,productName:o?.name,productDesc:u,productBadge:f,listingLink:x},o.shopify_id||o.id)})]})]},"empty-advertising-card")]})})]})});w.displayName="NavigationSearch";const L=({productImage:t,productName:s,productDesc:l,productBadge:r,className:n,listingLink:m})=>(0,e.jsx)(a.Link,{href:m,className:"block no-underline hover:text-current",children:(0,e.jsxs)("div",{className:(0,c.cn)("flex shrink-0 gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500",n),children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)("img",{src:t,loading:"lazy",alt:s,width:90,height:90,className:"size-[96px] object-contain"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:" h-[24px] ",children:r&&(0,e.jsx)(a.Text,{as:"p",html:r,className:"text-brand-0 mb-1 inline-block h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]"})}),(0,e.jsxs)("div",{children:[(0,e.jsx)(a.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:s}),l&&(0,e.jsx)(a.Text,{as:"p",html:l,className:"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]})]})}),j=({data:t,keywords:s,locale:l})=>(0,e.jsx)("div",{className:"laptop:gap-4 flex flex-wrap gap-3",children:s?.map((r,n)=>(0,e.jsx)("a",{href:`${l==="us"?"":l}${t?.moreLink}?q=${r?.toLowerCase()}`,className:"laptop:p-3 desktop:p-4 cursor-pointer p-2 text-sm font-bold leading-[1.4] hover:bg-[#F5F5F7]",children:r},n))});var M=w;
11
11
  //# sourceMappingURL=index.js.map
package/dist/cjs/biz-components/NavigationSearch/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/NavigationSearch/index.tsx"],
4
- "sourcesContent": ["/* eslint-disable react/no-unknown-property */\nimport { Picture, Text, Button, Container, Link, Heading, Grid, GridItem } from '../../components/index.js'\nimport { Search as SearchIcon, Close as CloseIcon } from '../HeaderNavigation/icons/index.js'\nimport { forwardRef, useCallback, useMemo, useState } from 'react'\nimport type { NavigationSearchProps } from './types.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\n\nimport { SearchStatus } from './types.js'\n\nimport { debounce } from 'es-toolkit'\nimport { cn, atobID, highlightSearchWord } from '../../helpers/utils.js'\n\nexport const canSearch = (target: any) => {\n return !(\n target.metafields?.global?.HideSearch ||\n target.metafields?.seo?.hidden ||\n target.metafields?.seo?.setting?.noindex\n )\n}\n\nconst NavigationSearch = forwardRef<HTMLDivElement, NavigationSearchProps>(\n ({ data, onSearch, onClose, searchResult, isSearching, keywords }, ref) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n\n const [searchValue, setSearchValue] = useState('')\n const [isComposing, setIsComposing] = useState(false)\n\n const debouncedFunction = debounce((value: string) => {\n onSearch(value)\n }, 300)\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter' && !isComposing) {\n window.open(`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${searchValue.toLowerCase()}`, '_self')\n }\n },\n [isComposing, searchValue, locale, data?.moreLink]\n )\n\n const searchKeywords = useMemo(() => {\n if (Array.isArray(keywords) && keywords?.length) {\n return keywords.map((keyword: any) => keyword.search_term)\n }\n if (Array.isArray(data?.popularWords) && data?.popularWords?.length) {\n return data?.popularWords.map((word: any) => word.popularWord)\n }\n return []\n }, [keywords, data?.popularWords])\n\n const getLink = useCallback(\n (item: any) => {\n const type = item.__typename || item.type\n switch (type) {\n case 'Product':\n return `/products${item.path}?q=${searchValue.toLowerCase()}`\n case 'Article':\n return `/blogs/${item.blog.handle}/${item.handle.replace('storefront-', '')}?q=${searchValue.toLowerCase()}`\n default:\n break\n }\n },\n [searchValue]\n )\n\n const searchStatus = useMemo(() => {\n if (!searchValue) {\n // \u6CA1\u6709\u641C\u7D22\u503C\n return SearchStatus.Default\n } else if (searchResult?.totalCount) {\n // \u6709\u641C\u7D22\u7ED3\u679C\n return SearchStatus.Predict\n } else if (!isSearching) {\n // \u6CA1\u6709\u641C\u7D22\u7ED3\u679C\n return SearchStatus.Empty\n }\n }, [searchResult?.totalCount, searchValue, isSearching])\n\n return (\n <Container childClassName=\"!bg-white\" className=\"relative\" ref={ref}>\n <style>\n {`\n .navigation-search-component input:-webkit-autofill,\n .navigation-search-component input:-webkit-autofill:hover,\n .navigation-search-component input:-webkit-autofill:focus {\n -webkit-box-shadow: 0 0 0 1000px transparent inset !important; /* \u80CC\u666F\u900F\u660E */\n -webkit-text-fill-color: #000 !important;\n transition: background-color 9999s ease-in-out 0s !important;\n caret-color: #000;\n }\n `}\n </style>\n <div className=\"navigation-search-component laptop:h-[52px] desktop:h-[60px] desktop:pt-6 flex items-center justify-between border-b border-b-gray-200 py-4 text-black\">\n <input\n value={searchValue}\n onCompositionStart={() => setIsComposing(true)}\n onCompositionEnd={() => setIsComposing(false)}\n onKeyDown={handleKeyDown}\n onChange={e => {\n setSearchValue(e.target.value)\n if (e.target.value) {\n debouncedFunction(e.target.value)\n }\n }}\n type=\"text\"\n className=\"basis-[200px] bg-white text-sm font-bold leading-[1.4] outline-none focus-visible:!outline-none \"\n placeholder={data?.placeholder}\n />\n <div className=\"flex items-center gap-3\">\n <SearchIcon className=\"size-5 cursor-pointer\" onClick={() => onSearch(searchValue)} />\n <div className=\"h-[20px] w-px bg-[#E4E5E6]\" />\n <CloseIcon className=\"size-5 cursor-pointer\" onClick={onClose} />\n </div>\n </div>\n <div className=\"desktop:gap-12 desktop:py-6 flex flex-col gap-6 py-4 text-black\">\n {searchStatus === SearchStatus.Predict ? (\n <>\n <div>\n <div className=\"flex items-center gap-1\">\n <Text html={data?.suggestText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n {searchResult?.items?.length > 6 && (\n <Button\n as=\"a\"\n iconClassName=\"size-4\"\n href={`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${searchValue.toLowerCase()}`}\n className=\"!p-0 !text-sm font-bold leading-[1.2]\"\n variant=\"link\"\n >\n {data?.moreText}\n </Button>\n )}\n </div>\n <div className=\"mt-2 flex flex-col\">\n {searchResult?.items\n ?.filter((item: any) => canSearch(item))\n .slice(0, 6)\n ?.map((item: any) => (\n <Link\n className=\"w-full p-4 no-underline hover:bg-[#F5F5F7] hover:text-current\"\n href={getLink(item)}\n key={item.id}\n >\n <Text\n html={highlightSearchWord(item.title, searchValue)}\n className=\"cursor-pointer text-sm font-bold leading-[1.4]\"\n />\n </Link>\n ))}\n </div>\n </div>\n <div>\n <Text html={data?.hotProductsText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n <div className=\"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2\">\n <Link asChild={!data?.advertisingLink} href={data?.advertisingLink}>\n <div className=\"relative\">\n <Picture\n source={data?.advertisingBgImg?.url}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={data?.advertisingTitle || 'Buy in Guide'}\n className={cn('font-bold text-white', {\n 'text-black': data?.advertisingTheme === 'dark',\n })}\n />\n <Text\n html={data?.advertisingSubtitle || '20.000mAh'}\n className={cn('text-sm font-bold text-white', {\n 'text-black': data?.advertisingTheme === 'dark',\n })}\n />\n </div>\n </div>\n </Link>\n {searchResult?.items\n ?.filter((item: any) => item.type.toLowerCase() === 'product')\n .slice(0, 7)\n ?.map((item: any) => {\n const variant = item?.variants?.[0]\n const productImage = `${variant?.image?.url || item?.images?.[0]?.url}`\n const productName = item?.title || item?.name\n const productDesc = item?.description\n const productBadge = item?.badge || ''\n const listingLink = `/products/${item?.handle}?variant=${atobID(variant?.id as string)}`\n return (\n <SearchProduct\n productImage={productImage}\n productName={productName}\n productDesc={productDesc}\n productBadge={productBadge}\n listingLink={listingLink}\n key={item.id}\n />\n )\n })}\n </div>\n </div>\n </>\n ) : (\n <>\n {searchStatus === SearchStatus.Empty && (\n <Text\n html={data?.noResultText}\n as=\"p\"\n className=\"border-b border-[#E4E5E6] pb-6 text-sm font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n <div>\n <Text html={data?.popularText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n <div className=\"mt-2\">\n <SearchKeyword data={data} keywords={searchKeywords} locale={locale} />\n {Array.isArray(data?.popularPages) && !!data?.popularPages?.length && (\n <Grid className=\"laptop:gap-4 laptop:mt-4 mt-3 gap-3\">\n {data?.popularPages?.map((item: any) => (\n <GridItem\n key={item?.id}\n className=\"tablet:col-span-6 laptop:p-3 desktop:p-4 laptop:col-span-3 col-span-12 p-2 hover:bg-[#F5F5F7]\"\n >\n <a\n href={`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${item?.popularPage.toLowerCase()}`}\n className=\"line-clamp-1 cursor-pointer text-sm font-bold leading-[1.4]\"\n >\n {item?.popularPage}\n </a>\n </GridItem>\n ))}\n </Grid>\n )}\n </div>\n </div>\n <div>\n <Text html={data?.hotProductsText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n <div className=\"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2\">\n <Link asChild={!data?.advertisingLink} href={data?.advertisingLink}>\n <div className=\"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Picture\n source={data?.advertisingBgImg?.url}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={data?.advertisingTitle || 'Buy in Guide'}\n className=\"font-bold text-white\"\n />\n <Text\n html={data?.advertisingSubtitle || '20.000mAh'}\n className=\"text-sm font-bold text-white\"\n />\n </div>\n </div>\n </Link>\n {data?.hotProducts?.slice(0, 7)?.map((item: any) => {\n const productDesc = item?.custom_description\n const productBadge = item?.badge || ''\n const listingLink = `/products/${item?.handle}?variant=${atobID(item?.shopify_id as string)}`\n return (\n <SearchProduct\n productImage={item?.image}\n productName={item?.name}\n productDesc={productDesc}\n productBadge={productBadge}\n listingLink={listingLink}\n key={item.id}\n />\n )\n })}\n </div>\n </div>\n </>\n )}\n </div>\n </Container>\n )\n }\n)\n\nNavigationSearch.displayName = 'NavigationSearch'\n\nconst SearchProduct = ({\n productImage,\n productName,\n productDesc,\n productBadge,\n className,\n listingLink,\n}: {\n productImage: string\n productName: string\n productDesc: string\n productBadge: string\n className?: string\n listingLink: string\n}) => {\n return (\n <Link href={listingLink} className=\"block no-underline hover:text-current\">\n <div\n className={cn(\n 'flex shrink-0 gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500',\n className\n )}\n >\n <div className=\"shrink-0\">\n <Picture\n source={productImage}\n width={90}\n height={90}\n className=\"size-[96px]\"\n imgClassName=\"object-contain h-full\"\n />\n </div>\n <div className=\"relative\">\n <div className=\" h-[24px] \">\n {productBadge && (\n <Text\n as=\"p\"\n html={productBadge}\n className=\"text-brand-0 mb-1 inline-block h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[24px]\"\n />\n )}\n </div>\n <div>\n <Link href={listingLink} className=\"no-underline hover:text-current\">\n <Text\n className=\"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]\"\n html={productName}\n />\n </Link>\n {productDesc && (\n <Text\n as=\"p\"\n html={productDesc}\n className=\"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n </div>\n </div>\n </div>\n </Link>\n )\n}\n\nconst SearchKeyword = ({ data, keywords, locale }: { data: any; keywords: any[]; locale: string }) => {\n return (\n <div className=\"laptop:gap-4 flex flex-wrap gap-3\">\n {keywords?.map((keyword: any, index) => (\n <a\n href={`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${keyword?.toLowerCase()}`}\n key={index}\n className=\"laptop:p-3 desktop:p-4 cursor-pointer p-2 text-sm font-bold leading-[1.4] hover:bg-[#F5F5F7]\"\n >\n {keyword}\n </a>\n ))}\n </div>\n )\n}\n\nexport default NavigationSearch\n"],
5
- "mappings": "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",
6
- "names": ["NavigationSearch_exports", "__export", "canSearch", "NavigationSearch_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_icons", "import_react", "import_AiuiProvider", "import_types", "import_es_toolkit", "import_utils", "target", "NavigationSearch", "data", "onSearch", "onClose", "searchResult", "isSearching", "keywords", "ref", "locale", "copyWriting", "searchValue", "setSearchValue", "isComposing", "setIsComposing", "debouncedFunction", "value", "handleKeyDown", "e", "searchKeywords", "keyword", "word", "getLink", "item", "searchStatus", "SearchIcon", "CloseIcon", "variant", "productImage", "productName", "productDesc", "productBadge", "listingLink", "SearchProduct", "SearchKeyword", "className", "index"]
4
+ "sourcesContent": ["/* eslint-disable react/no-unknown-property */\nimport { Picture, Text, Button, Container, Link, Heading, Grid, GridItem } from '../../components/index.js'\nimport { Search as SearchIcon, Close as CloseIcon } from '../HeaderNavigation/icons/index.js'\nimport { forwardRef, useCallback, useMemo, useState, useEffect, useRef } from 'react'\nimport type { NavigationSearchProps } from './types.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\n\nimport { SearchStatus } from './types.js'\n\nimport { debounce } from 'es-toolkit'\nimport { cn, atobID, highlightSearchWord } from '../../helpers/utils.js'\n\nexport const canSearch = (target: any) => {\n return !(\n target.metafields?.global?.HideSearch ||\n target.metafields?.seo?.hidden ||\n target.metafields?.seo?.setting?.noindex\n )\n}\n\nconst NavigationSearch = forwardRef<HTMLDivElement, NavigationSearchProps>(\n ({ data, onSearch, onClose, searchResult, isSearching, keywords }, ref) => {\n const { locale = 'us', copyWriting } = useAiuiContext()\n\n const [searchValue, setSearchValue] = useState('')\n const [isComposing, setIsComposing] = useState(false)\n const inputRef = useRef<HTMLInputElement>(null)\n\n // \u81EA\u52A8\u805A\u7126\u5230\u8F93\u5165\u6846\uFF08\u963B\u6B62\u6EDA\u52A8\u884C\u4E3A\uFF09\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.focus({ preventScroll: true })\n }\n }, [])\n\n const debouncedFunction = debounce((value: string) => {\n onSearch(value)\n }, 300)\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter' && !isComposing) {\n window.open(`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${searchValue.toLowerCase()}`, '_self')\n }\n },\n [isComposing, searchValue, locale, data?.moreLink]\n )\n\n const searchKeywords = useMemo(() => {\n if (Array.isArray(keywords) && keywords?.length) {\n return keywords.map((keyword: any) => keyword.search_term)\n }\n if (Array.isArray(data?.popularWords) && data?.popularWords?.length) {\n return data?.popularWords.map((word: any) => word.popularWord)\n }\n return []\n }, [keywords, data?.popularWords])\n\n const getLink = useCallback(\n (item: any) => {\n const type = item.__typename || item.type\n switch (type) {\n case 'Product':\n return `/products${item.path}?q=${searchValue.toLowerCase()}`\n case 'Article':\n return `/blogs/${item.blog.handle}/${item.handle.replace('storefront-', '')}?q=${searchValue.toLowerCase()}`\n default:\n break\n }\n },\n [searchValue]\n )\n\n const searchStatus = useMemo(() => {\n if (!searchValue) {\n // \u6CA1\u6709\u641C\u7D22\u503C\n return SearchStatus.Default\n } else if (searchResult?.totalCount) {\n // \u6709\u641C\u7D22\u7ED3\u679C\n return SearchStatus.Predict\n } else if (!isSearching) {\n // \u6CA1\u6709\u641C\u7D22\u7ED3\u679C\n return SearchStatus.Empty\n }\n }, [searchResult?.totalCount, searchValue, isSearching])\n\n return (\n <Container childClassName=\"!bg-white\" className=\"relative\" ref={ref}>\n <style>\n {`\n .navigation-search-component input:-webkit-autofill,\n .navigation-search-component input:-webkit-autofill:hover,\n .navigation-search-component input:-webkit-autofill:focus {\n -webkit-box-shadow: 0 0 0 1000px transparent inset !important; /* \u80CC\u666F\u900F\u660E */\n -webkit-text-fill-color: #000 !important;\n transition: background-color 9999s ease-in-out 0s !important;\n caret-color: #000;\n }\n `}\n </style>\n <div className=\"navigation-search-component laptop:h-[52px] desktop:h-[60px] desktop:pt-6 flex items-center justify-between gap-4 border-b border-b-gray-200 py-4 text-black\">\n <input\n ref={inputRef}\n value={searchValue}\n onCompositionStart={() => setIsComposing(true)}\n onCompositionEnd={() => setIsComposing(false)}\n onKeyDown={handleKeyDown}\n onChange={e => {\n setSearchValue(e.target.value)\n if (e.target.value) {\n debouncedFunction(e.target.value)\n }\n }}\n type=\"text\"\n className=\"flex-1 bg-white text-sm font-bold leading-[1.4] outline-none focus-visible:!outline-none \"\n placeholder={data?.placeholder}\n />\n <div className=\"flex items-center gap-3\">\n <SearchIcon className=\"size-5 cursor-pointer\" onClick={() => onSearch(searchValue)} />\n <div className=\"h-[20px] w-px bg-[#E4E5E6]\" />\n <CloseIcon className=\"size-5 cursor-pointer\" onClick={onClose} />\n </div>\n </div>\n <div className=\"desktop:gap-12 desktop:py-6 flex flex-col gap-6 py-4 text-black\">\n {searchStatus === SearchStatus.Predict ? (\n <>\n <div>\n <div className=\"flex items-center gap-1\">\n <Text html={data?.suggestText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n {searchResult?.items?.length > 6 && (\n <Button\n as=\"a\"\n iconClassName=\"size-4\"\n href={`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${searchValue.toLowerCase()}`}\n className=\"!p-0 !text-sm font-bold leading-[1.2]\"\n variant=\"link\"\n >\n {data?.moreText}\n </Button>\n )}\n </div>\n <div className=\"mt-2 flex flex-col\">\n {searchResult?.items\n ?.filter((item: any) => canSearch(item))\n .slice(0, 6)\n ?.map((item: any) => (\n <Link\n className=\"w-full p-4 no-underline hover:bg-[#F5F5F7] hover:text-current\"\n href={getLink(item)}\n key={item.id}\n >\n <Text\n html={highlightSearchWord(item.title, searchValue)}\n className=\"cursor-pointer text-sm font-bold leading-[1.4]\"\n />\n </Link>\n ))}\n </div>\n </div>\n <div key=\"predict-advertising-card\">\n <Text html={data?.hotProductsText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n <div className=\"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2\">\n <Link asChild={!data?.advertisingLink} href={data?.advertisingLink}>\n <div className=\"relative\">\n <Picture\n source={data?.advertisingBgImg?.url}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={data?.advertisingTitle || 'Buy in Guide'}\n className={cn('font-bold text-white', {\n 'text-black': data?.advertisingTheme === 'dark',\n })}\n />\n <Text\n html={data?.advertisingSubtitle || '20.000mAh'}\n className={cn('text-sm font-bold text-white', {\n 'text-black': data?.advertisingTheme === 'dark',\n })}\n />\n </div>\n </div>\n </Link>\n {searchResult?.items\n ?.filter((item: any) => item.type.toLowerCase() === 'product')\n .slice(0, 7)\n ?.map((item: any) => {\n const variant = item?.variants?.[0]\n const productImage = `${variant?.image?.url || item?.images?.[0]?.url}`\n const productName = item?.title || item?.name\n const productDesc = item?.description\n const productBadge = item?.badge || ''\n const listingLink = `/products/${item?.handle}?variant=${atobID(variant?.id as string)}`\n return (\n <SearchProduct\n productImage={productImage}\n productName={productName}\n productDesc={productDesc}\n productBadge={productBadge}\n listingLink={listingLink}\n key={item.id}\n />\n )\n })}\n </div>\n </div>\n </>\n ) : (\n <>\n {searchStatus === SearchStatus.Empty && (\n <Text\n html={data?.noResultText}\n as=\"p\"\n className=\"border-b border-[#E4E5E6] pb-6 text-sm font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n <div>\n <Text html={data?.popularText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n <div className=\"mt-2\">\n <SearchKeyword data={data} keywords={searchKeywords} locale={locale} />\n {Array.isArray(data?.popularPages) && !!data?.popularPages?.length && (\n <Grid className=\"laptop:gap-4 laptop:mt-4 mt-3 gap-3\">\n {data?.popularPages?.map((item: any) => (\n <GridItem\n key={item?.id}\n className=\"tablet:col-span-6 laptop:p-3 desktop:p-4 laptop:col-span-3 col-span-12 p-2 hover:bg-[#F5F5F7]\"\n >\n <a\n href={`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${item?.popularPage.toLowerCase()}`}\n className=\"line-clamp-1 cursor-pointer text-sm font-bold leading-[1.4]\"\n >\n {item?.popularPage}\n </a>\n </GridItem>\n ))}\n </Grid>\n )}\n </div>\n </div>\n <div key=\"empty-advertising-card\">\n <Text html={data?.hotProductsText} className=\"text-sm font-bold leading-[1.4] text-[#6D6D6F]\" />\n <div className=\"tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 tablet:gap-x-3 tablet:gap-y-4 laptop:gap-4 mt-2 grid grid-cols-1 gap-2\">\n <Link asChild={!data?.advertisingLink} href={data?.advertisingLink}>\n <div className=\"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Picture\n source={data?.advertisingBgImg?.url}\n className=\"laptop:h-[120px] h-[114px]\"\n imgClassName=\"object-cover h-full\"\n />\n <div className=\"absolute inset-x-0 bottom-0 p-4\">\n <Heading\n size={2}\n html={data?.advertisingTitle || 'Buy in Guide'}\n className=\"font-bold text-white\"\n />\n <Text\n html={data?.advertisingSubtitle || '20.000mAh'}\n className=\"text-sm font-bold text-white\"\n />\n </div>\n </div>\n </Link>\n {data?.hotProducts?.slice(0, 7)?.map((item: any) => {\n const productDesc = item?.custom_description\n const productBadge = item?.badge || ''\n const listingLink = `/products/${item?.handle}?variant=${atobID(item?.shopify_id as string)}`\n return (\n <SearchProduct\n productImage={item?.image}\n productName={item?.name}\n productDesc={productDesc}\n productBadge={productBadge}\n listingLink={listingLink}\n key={item.shopify_id || item.id}\n />\n )\n })}\n </div>\n </div>\n </>\n )}\n </div>\n </Container>\n )\n }\n)\n\nNavigationSearch.displayName = 'NavigationSearch'\n\nconst SearchProduct = ({\n productImage,\n productName,\n productDesc,\n productBadge,\n className,\n listingLink,\n}: {\n productImage: string\n productName: string\n productDesc: string\n productBadge: string\n className?: string\n listingLink: string\n}) => {\n return (\n <Link href={listingLink} className=\"block no-underline hover:text-current\">\n <div\n className={cn(\n 'flex shrink-0 gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500',\n className\n )}\n >\n <div className=\"shrink-0\">\n <img\n src={productImage}\n loading=\"lazy\"\n alt={productName}\n width={90}\n height={90}\n className=\"size-[96px] object-contain\"\n />\n </div>\n <div className=\"relative\">\n <div className=\" h-[24px] \">\n {productBadge && (\n <Text\n as=\"p\"\n html={productBadge}\n className=\"text-brand-0 mb-1 inline-block h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]\"\n />\n )}\n </div>\n <div>\n <Text\n className=\"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]\"\n html={productName}\n />\n {productDesc && (\n <Text\n as=\"p\"\n html={productDesc}\n className=\"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n )}\n </div>\n </div>\n </div>\n </Link>\n )\n}\n\nconst SearchKeyword = ({ data, keywords, locale }: { data: any; keywords: any[]; locale: string }) => {\n return (\n <div className=\"laptop:gap-4 flex flex-wrap gap-3\">\n {keywords?.map((keyword: any, index) => (\n <a\n href={`${locale === 'us' ? '' : locale}${data?.moreLink}?q=${keyword?.toLowerCase()}`}\n key={index}\n className=\"laptop:p-3 desktop:p-4 cursor-pointer p-2 text-sm font-bold leading-[1.4] hover:bg-[#F5F5F7]\"\n >\n {keyword}\n </a>\n ))}\n </div>\n )\n}\n\nexport default NavigationSearch\n"],
5
+ "mappings": "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",
6
+ "names": ["NavigationSearch_exports", "__export", "canSearch", "NavigationSearch_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_icons", "import_react", "import_AiuiProvider", "import_types", "import_es_toolkit", "import_utils", "target", "NavigationSearch", "data", "onSearch", "onClose", "searchResult", "isSearching", "keywords", "ref", "locale", "copyWriting", "searchValue", "setSearchValue", "isComposing", "setIsComposing", "inputRef", "debouncedFunction", "value", "handleKeyDown", "e", "searchKeywords", "keyword", "word", "getLink", "item", "searchStatus", "SearchIcon", "CloseIcon", "variant", "productImage", "productName", "productDesc", "productBadge", "listingLink", "SearchProduct", "SearchKeyword", "className", "index"]
7
7
  }
package/dist/cjs/biz-components/SearchPage/index.d.ts CHANGED
@@ -2,5 +2,5 @@ import type { SearchPageProps } from './types';
2
2
  /**
3
3
  * 搜索页面
4
4
  */
5
- declare const SearchPage: ({ searchResult, searchValue, data, onSecondaryButton, onPrimaryButton, onChangeSort, loading, searchResultCount, onChangeTab, buildProps, }: SearchPageProps) => import("react/jsx-runtime").JSX.Element;
5
+ declare const SearchPage: ({ searchResult, searchValue, data, onSecondaryButton, onPrimaryButton, onChangeSort, loading, shopNowLoadingProductId, searchResultCount, onChangeTab, buildProps, }: SearchPageProps) => import("react/jsx-runtime").JSX.Element;
6
6
  export default SearchPage;
package/dist/cjs/biz-components/SearchPage/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var S=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var j=(s,o)=>{for(var l in o)S(s,l,{get:o[l],enumerable:!0})},F=(s,o,l,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let p of O(o))!R.call(s,p)&&p!==l&&S(s,p,{get:()=>o[p],enumerable:!(r=$(o,p))||r.enumerable});return s};var G=s=>F(S({},"__esModule",{value:!0}),s);var q={};j(q,{default:()=>H});module.exports=G(q);var e=require("react/jsx-runtime"),t=require("../../components/index.js"),I=require("../HeaderNavigation/icons/index.js"),n=require("react"),d=require("../../helpers/utils.js"),k=require("../AiuiProvider/index.js"),z=require("../ShelfDisplay/shelfDisplay.js"),x=require("./types.js");const E=({product:s,onSecondaryButton:o,onPrimaryButton:l,searchValue:r,variantData:p})=>{const c=(0,n.useMemo)(()=>p||s?.variants?.[0],[s,p]),{locale:m="us",copyWriting:u}=(0,k.useAiuiContext)(),h=(0,n.useMemo)(()=>`${m==="us"?"":"/"+m}/products/${s?.handle}?variant=${(0,d.atobID)(c?.id)}?ref=search_result_${r?.toLowerCase()}`,[s?.handle,c?.id,r]),b=c?.coupons?.[0],{price:i,basePrice:N}=(0,z.formatVariantPrice)({locale:m,amount:b?b.variant_price4wscode:c?.price,baseAmount:b?c?.price:0,currencyCode:s?.price?.currencyCode||"USD"}),y=(0,n.useMemo)(()=>s?.tags?.filter?.(v=>v?.startsWith?.("CLtag"))?.map?.(v=>v?.replace?.("CLtag:",""))?.slice?.(0,2),[s?.tags]);return(0,e.jsx)("div",{className:"ipc_search_product_item lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[360px] relative h-auto",children:s?.type==="advertising"?(0,e.jsxs)(t.Link,{href:s?.advertisingLink,className:"h-full",children:[(0,e.jsx)(t.Picture,{source:s?.advertisingBgImg?.url,className:"size-full",imgClassName:"size-full object-cover"}),(0,e.jsxs)("div",{className:"desktop:p-6 absolute inset-0 z-[2] p-4 [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(t.Text,{html:s?.advertisingTitle,className:"desktop:text-[18px] text-sm font-bold text-white"}),(0,e.jsx)(t.Heading,{size:3,html:s?.advertisingSubtitle,className:"laptop:line-clamp-3 mt-2 line-clamp-4 font-bold text-white"})]})]}):(0,e.jsxs)("a",{href:h,className:" tablet:hover:bg-info-white desktop:p-6 desktop:pt-4 tablet:p-4 flex h-full flex-col bg-[#EAEAEC] px-2 py-4 no-underline duration-300",children:[(0,e.jsx)("div",{className:"ipc_search_product_item_image",children:(0,e.jsx)(t.Picture,{className:"lg-desktop:size-[196px] mx-auto size-[138px]",source:`${c?.image?.url||s?.images?.[0]?.url}}`,alt:s.title,imgClassName:"object-cover size-full"})}),(0,e.jsxs)("div",{className:"ipc_search_product_item_content desktop:mt-2 lg-desktop:mt-3 desktop:gap-6 mt-1 flex flex-1 flex-col justify-between gap-4",children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)("div",{className:"lg-desktop:h-[28px] mb-2 flex h-[24px] gap-2",children:y?.map((v,_)=>(0,e.jsx)(t.Text,{as:"p",html:v,className:"text-brand-0 lg-desktop:px-2 lg-desktop:!leading-[28px] h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[24px]"},_))}),(0,e.jsx)(t.Text,{className:"desktop:text-2xl tablet:line-clamp-2 line-clamp-3 text-xl font-bold !leading-[1.2]",weight:"bold",html:(0,d.highlightSearchWord)(s?.title||"",r||"")}),(0,e.jsx)(t.Text,{as:"p",className:"lg-desktop:text-[18px] tablet:line-clamp-1 mt-1 line-clamp-2 text-sm font-bold",html:(0,d.highlightSearchWord)(s.description,r||"")})]}),(0,e.jsxs)("div",{children:[(0,e.jsx)("div",{className:"mb-2 flex items-center",children:c?.availableForSale?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:"final-price text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold",children:c?.availableForSale&&i||""}),(0,e.jsx)("div",{className:"origin-price tablet:text-xl lg-desktop:text-2xl text-info-secondary ml-1 text-[18px] font-bold line-through",children:c?.availableForSale&&N||""})]}):(0,e.jsx)("div",{className:"text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold",children:u?.soldOutText||"Sold Out"})}),(0,e.jsxs)("div",{className:(0,d.cn)("ipc_search_product_item_button_group","lg-desktop:gap-3 laptop:flex-row flex flex-col items-center gap-2"),children:[u?.learnMoreText&&(0,e.jsx)(t.Button,{variant:"secondary",className:"laptop:w-auto w-full",size:"lg",disabled:!c?.availableForSale,onClick:()=>o?.(),children:u?.learnMoreText}),u?.shopNowText&&(0,e.jsx)(t.Button,{variant:"primary",className:"laptop:w-auto w-full",size:"lg",disabled:!c?.availableForSale,onClick:()=>l?.(),children:u?.shopNowText})]})]})]})]})})},K=({blog:s,searchValue:o})=>{const{copyWriting:l,locale:r}=(0,k.useAiuiContext)(),p=(0,n.useMemo)(()=>`${r==="us"?"":"/"+r}/blogs/${s?.blog?.handle}/${s?.handle.replace("storefront-","")}`,[s,r]);return(0,e.jsx)("div",{className:"ipc_search_blog_item border-b border-[#E4E5E6] py-6",children:(0,e.jsxs)("div",{className:"ipc_search_blog_item_content laptop:flex-row-reverse laptop:gap-8 desktop:gap-16 flex flex-col gap-4",children:[(0,e.jsx)("div",{className:"laptop:flex-[440] desktop:flex-[540] desktop:h-[280px] h-[240px]",children:(0,e.jsx)(t.Picture,{source:s?.image?.url,className:"size-full",imgClassName:"size-full object-cover",alt:s?.title})}),(0,e.jsxs)("div",{className:"laptop:flex-[424] desktop:flex-[704] lg-desktop:flex-[1056] flex flex-col justify-center",children:[(0,e.jsx)(t.Heading,{size:3,html:(0,d.highlightSearchWord)(s?.title,o)}),(0,e.jsx)(t.Text,{html:(0,d.highlightSearchWord)(s?.content,o),className:"lg-desktop:text-[18px] desktop:text-[16px] mt-1 line-clamp-2 text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"desktop:mt-6 mt-4",children:(0,e.jsx)(t.Button,{as:"a",href:p,variant:"secondary",size:"lg",children:l?.learnMoreText||"Learn More"})})]})]})})},W=({searchValue:s,page:o})=>{const{copyWriting:l,locale:r="us"}=(0,k.useAiuiContext)(),p=(0,n.useMemo)(()=>`${r==="us"?"":`/${r}`}/${o?.handle}`,[o,r]);return(0,e.jsxs)("div",{className:"ipc_search_page_items border-b border-[#E4E5E6] py-6",children:[(0,e.jsx)(t.Heading,{size:3,html:(0,d.highlightSearchWord)(o?.name,s)}),(0,e.jsx)(t.Text,{as:"p",html:(0,d.highlightSearchWord)(o?.bodySummary||"",s),className:"lg-desktop:text-[18px] desktop:text-[16px] mt-1 text-sm font-bold leading-[1.4]"}),(0,e.jsx)(t.Button,{as:"a",href:p,variant:"secondary",size:"lg",className:"desktop:mt-6 mt-4",children:l?.learnMoreText||"Learn More"})]})},P=({url:s,label:o})=>(0,e.jsxs)("div",{className:"flex flex-col items-center justify-center gap-4",children:[(0,e.jsx)(t.Picture,{source:s,className:"h-[180px] w-[240px]",imgClassName:"object-cover"}),(0,e.jsx)(t.Text,{html:o,className:"desktop:text-[18px] text-sm font-bold leading-[1.4]"})]}),T=({products:s,title:o,buildProps:l,onSecondaryButton:r,onPrimaryButton:p})=>{const{products:c}=l||{};return(0,e.jsxs)("div",{className:"ipc_search_recommend_product tablet:pt-[80px] laptop:pt-[96px] desktop:pt-[112px] lg-desktop:pt-[128px] pt-[64px]",children:[(0,e.jsx)(t.Heading,{size:4,weight:"bold",html:o}),(0,e.jsx)("div",{className:" tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 mt-6 grid grid-cols-2 gap-x-3 gap-y-4",children:s?.map((m,u)=>{const h=c?.find(i=>i.handle===m.handle),b=h?.variants?.find(i=>i.sku===m.sku);return(0,e.jsx)(E,{product:h,variantData:b,onSecondaryButton:()=>r?.(),onPrimaryButton:()=>p?.()},m.id+u)})})]})},U=({searchResult:s,searchValue:o,data:l,onSecondaryButton:r,onPrimaryButton:p,onChangeSort:c,loading:m,searchResultCount:u,onChangeTab:h,buildProps:b})=>{const[i,N]=(0,n.useState)(l?.tabs?.[0]),y=(0,n.useRef)(!1),[v,_]=(0,n.useState)(!1),[w,C]=(0,n.useState)({[x.SearchPageTabType.PRODUCTS]:l?.tabs?.find(a=>a.tabType===x.SearchPageTabType.PRODUCTS)?.sortKeys?.[0],[x.SearchPageTabType.BLOGS]:l?.tabs?.find(a=>a.tabType===x.SearchPageTabType.BLOGS)?.sortKeys?.[0],[x.SearchPageTabType.PAGES]:l?.tabs?.find(a=>a.tabType===x.SearchPageTabType.PAGES)?.sortKeys?.[0]}),f=(0,n.useMemo)(()=>s?.products||[],[s]),L=(0,n.useMemo)(()=>s?.blogs||[],[s]),B=(0,n.useMemo)(()=>s?.pages||[],[s]),D=(0,n.useMemo)(()=>Object.values(u||{}).reduce((a,g)=>a+g,0),[u]),M=(0,n.useMemo)(()=>{const a={advertisingBgImg:i?.advertisingBgImg,advertisingTitle:i?.advertisingTitle,advertisingSubtitle:i?.advertisingSubtitle,advertisingLink:i?.advertisingLink,type:"advertising"};return!y.current&&f?.length&&(f?.length>=8?(f?.splice(7,0,a),y.current=!0):(f?.push(a),y.current=!0)),f},[i,f]);return(0,e.jsxs)("div",{className:"ipc_search_page desktop:py-[128px] tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-4 py-16",children:[(0,e.jsx)(t.Heading,{size:4,weight:"bold",html:l?.title?.replace("$totalCount",D?.toString())?.replace("$inputValue",`"${o}"`)}),(0,e.jsx)("div",{className:"mt-6",children:(0,e.jsxs)(t.Tabs,{className:"ipc_search_page_tabs",defaultValue:"products",children:[(0,e.jsxs)("div",{className:"desktop:flex desktop:items-center desktop:flex-row desktop:gap-6 desktop:justify-between",children:[(0,e.jsx)(t.TabsList,{children:l?.tabs?.map(a=>(0,e.jsxs)(t.TabsTrigger,{onClick:()=>{N(a);const g=a?.sortKeys?.[0];g&&(C(A=>({...A,[a?.tabType]:g})),c?.(a?.tabType,g)),h?.(a?.tabType)},defaultValue:"products",value:a.tabType,children:[a.label," (",u?.[a.tabType],")"]},a.id))}),(0,e.jsxs)(t.DropdownMenu,{onOpenChange:_,children:[(0,e.jsx)(t.DropdownMenuTrigger,{asChild:!0,children:(0,e.jsxs)("button",{className:"desktop:mt-0 mt-6 flex items-center text-base font-bold leading-[1.2]",children:[i?.sortLabel," ",w?.[i?.tabType]?.label," ",(0,e.jsx)(I.DownArrow,{className:(0,d.cn)("inline-block size-4",{"rotate-180":v})})]})}),(0,e.jsx)(t.DropdownMenuContent,{align:"start",sideOffset:8,className:"rounded-none bg-white !px-0 py-2",children:i?.sortKeys?.map(a=>(0,e.jsx)(t.DropdownMenuItem,{className:(0,d.cn)("laptop:px-4 laptop:text-base px-3 py-4 text-sm font-bold hover:bg-[#EAEAEC] hover:text-current",{"bg-[#EAEAEC]":w?.[i?.tabType]?.value===a.value}),onClick:()=>{y.current=!1,c?.(i?.tabType,a),C(g=>({...g,[i?.tabType]:a}))},children:a.label},a.id))})]})]}),(0,e.jsxs)(t.TabsContent,{value:x.SearchPageTabType.PRODUCTS,className:"ipc_search_page_tabs_products_content mt-6",children:[(0,e.jsx)("div",{className:"tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 grid grid-cols-2 gap-x-3 gap-y-4",children:M?.map((a,g)=>(0,e.jsx)(E,{searchValue:o,product:a,onSecondaryButton:()=>r?.(a),onPrimaryButton:()=>p?.(a)},(a.id||"")+g))}),m?(0,e.jsx)("div",{className:"mt-6 flex w-full justify-center",children:(0,e.jsx)(t.LoadingDots,{})}):!f?.length&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P,{url:l?.noResultImage?.url,label:l?.noResultLabel}),(0,e.jsx)(T,{products:l?.recommendProducts||[],buildProps:b,title:l?.recommendProductsTitle})]})]}),(0,e.jsx)(t.TabsContent,{value:x.SearchPageTabType.BLOGS,className:"ipc_search_page_tabs_blogs_content",children:(0,e.jsxs)("div",{children:[L?.map(a=>(0,e.jsx)(K,{blog:a,searchValue:o},a.id)),m?(0,e.jsx)("div",{className:"mt-6 flex justify-center",children:(0,e.jsx)(t.LoadingDots,{})}):!L?.length&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P,{url:l?.noResultImage?.url,label:l?.noResultLabel}),(0,e.jsx)(T,{products:l?.recommendProducts||[],buildProps:b,title:l?.recommendProductsTitle})]})]})}),(0,e.jsxs)(t.TabsContent,{value:x.SearchPageTabType.PAGES,className:"ipc_search_page_tabs_pages_content",children:[(0,e.jsx)("div",{children:B?.map((a,g)=>(0,e.jsx)(W,{page:a,searchValue:o},(a.global_id||a.id)+g))}),m?(0,e.jsx)("div",{className:"mt-6 flex justify-center",children:(0,e.jsx)(t.LoadingDots,{})}):!B?.length&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P,{url:l?.noResultImage?.url,label:l?.noResultLabel}),(0,e.jsx)(T,{products:l?.recommendProducts||[],buildProps:b,title:l?.recommendProductsTitle})]})]})]})})]})};var H=U;
1
+ "use strict";var S=Object.defineProperty;var O=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var j=Object.prototype.hasOwnProperty;var F=(t,o)=>{for(var l in o)S(t,l,{get:o[l],enumerable:!0})},G=(t,o,l,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let p of R(o))!j.call(t,p)&&p!==l&&S(t,p,{get:()=>o[p],enumerable:!(i=O(o,p))||i.enumerable});return t};var K=t=>G(S({},"__esModule",{value:!0}),t);var J={};F(J,{default:()=>q});module.exports=K(J);var e=require("react/jsx-runtime"),s=require("../../components/index.js"),z=require("../HeaderNavigation/icons/index.js"),n=require("react"),d=require("../../helpers/utils.js"),_=require("../AiuiProvider/index.js"),D=require("../ShelfDisplay/shelfDisplay.js"),v=require("./types.js");const E=({product:t,onSecondaryButton:o,onPrimaryButton:l,searchValue:i,variantData:p,shopNowLoadingProductId:y})=>{const r=(0,n.useMemo)(()=>p||t?.variants?.[0],[t,p]),{locale:x="us",copyWriting:g}=(0,_.useAiuiContext)(),k=y===t?.id,b=(0,n.useMemo)(()=>`${x==="us"?"":"/"+x}/products/${t?.handle}?variant=${(0,d.atobID)(r?.id)}?ref=search_result_${i?.toLowerCase()}`,[t?.handle,r?.id,i,x]),c=r?.coupons?.[0],{price:T,basePrice:f}=(0,D.formatVariantPrice)({locale:x,amount:c?c.variant_price4wscode:r?.price,baseAmount:c?r?.price:0,currencyCode:t?.price?.currencyCode||"USD"}),P=(0,n.useMemo)(()=>t?.tags?.filter?.(m=>m?.startsWith?.("CLtag"))?.map?.(m=>m?.replace?.("CLtag:",""))?.slice?.(0,2),[t?.tags]);return(0,e.jsx)("div",{className:"ipc_search_product_item lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[360px] relative h-auto",children:t?.type==="advertising"&&t?.advertisingLink?(0,e.jsxs)(s.Link,{href:t?.advertisingLink,className:"h-full",children:[(0,e.jsx)(s.Picture,{source:t?.advertisingBgImg?.url,className:"size-full",imgClassName:"size-full object-cover"}),(0,e.jsxs)("div",{className:"desktop:p-6 absolute inset-0 z-[2] p-4 [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(s.Text,{html:t?.advertisingTitle,className:(0,d.cn)("desktop:text-[18px] text-sm font-bold",{"text-white":t?.advertisingTheme==="light","text-info-primary":t?.advertisingTheme==="dark"})}),t?.advertisingSubtitle&&(0,e.jsx)(s.Heading,{size:3,html:t?.advertisingSubtitle,className:(0,d.cn)("laptop:line-clamp-3 mt-2 line-clamp-4 font-bold",{"text-white":t?.advertisingTheme==="light","text-info-primary":t?.advertisingTheme==="dark"})})]})]}):(0,e.jsxs)("a",{href:b,className:" tablet:hover:bg-info-white desktop:p-6 desktop:pt-4 tablet:p-4 flex h-full flex-col bg-[#EAEAEC] px-2 py-4 no-underline duration-300",children:[(0,e.jsx)("div",{className:"ipc_search_product_item_image",children:(0,e.jsx)(s.Picture,{className:"lg-desktop:size-[196px] mx-auto size-[138px]",source:`${r?.image?.url||t?.images?.[0]?.url}}`,alt:t?.title,imgClassName:"object-cover size-full"})}),(0,e.jsxs)("div",{className:"ipc_search_product_item_content desktop:mt-2 lg-desktop:mt-3 desktop:gap-6 mt-1 flex flex-1 flex-col justify-between gap-4",children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)("div",{className:"lg-desktop:h-[28px] mb-2 flex h-[24px] gap-2",children:P?.map((m,N)=>(0,e.jsx)(s.Text,{as:"p",html:m,className:"text-brand-0 lg-desktop:px-2 lg-desktop:!leading-[28px] h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]"},N))}),(0,e.jsx)(s.Text,{className:"lg-desktop:text-2xl tablet:line-clamp-2 line-clamp-3 text-xl font-bold !leading-[1.2]",weight:"bold",html:(0,d.highlightSearchWord)(t?.title||"",i||"")}),(0,e.jsx)(s.Text,{as:"p",className:"lg-desktop:text-[18px] tablet:line-clamp-1 mt-1 line-clamp-2 text-sm font-bold",html:(0,d.highlightSearchWord)(t?.description,i||"")})]}),(0,e.jsxs)("div",{children:[(0,e.jsx)("div",{className:"mb-2 flex items-center",children:r?.availableForSale?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:"final-price text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold",children:r?.availableForSale&&T||""}),(0,e.jsx)("div",{className:"origin-price tablet:text-xl lg-desktop:text-2xl text-info-secondary ml-1 text-[18px] font-bold line-through",children:r?.availableForSale&&f||""})]}):(0,e.jsx)("div",{className:"text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold",children:g?.soldOutText||"Sold Out"})}),(0,e.jsxs)("div",{className:(0,d.cn)("ipc_search_product_item_button_group","lg-desktop:gap-3 laptop:flex-row flex flex-col items-center gap-2"),children:[g?.learnMoreText&&(0,e.jsx)(s.Button,{variant:"secondary",className:"laptop:w-auto w-full",size:"lg",disabled:!r?.availableForSale,onClick:m=>{m.preventDefault(),m.stopPropagation(),o?.()},children:g?.learnMoreText}),g?.shopNowText&&(0,e.jsx)(s.Button,{variant:"primary",className:"laptop:w-auto w-full",size:"lg",disabled:!r?.availableForSale,loading:k,onClick:m=>{m.preventDefault(),m.stopPropagation(),l?.()},children:g?.shopNowText})]})]})]})]})})},W=({blog:t,searchValue:o})=>{const{copyWriting:l,locale:i}=(0,_.useAiuiContext)(),p=(0,n.useMemo)(()=>`${i==="us"?"":"/"+i}/blogs/${t?.blog?.handle}/${t?.handle.replace("storefront-","")}`,[t,i]);return(0,e.jsx)("div",{className:"ipc_search_blog_item border-b border-[#E4E5E6] py-6",children:(0,e.jsxs)("div",{className:"ipc_search_blog_item_content laptop:flex-row-reverse laptop:gap-8 desktop:gap-16 flex flex-col gap-4",children:[(0,e.jsx)("div",{className:"laptop:flex-[440] desktop:flex-[540] desktop:h-[280px] h-[240px]",children:(0,e.jsx)(s.Picture,{source:t?.image?.url,className:"size-full",imgClassName:"size-full object-cover",alt:t?.title})}),(0,e.jsxs)("div",{className:"laptop:flex-[424] desktop:flex-[704] lg-desktop:flex-[1056] flex flex-col justify-center",children:[(0,e.jsx)(s.Heading,{size:3,html:(0,d.highlightSearchWord)(t?.title,o)}),(0,e.jsx)(s.Text,{html:(0,d.highlightSearchWord)(t?.content,o),className:"lg-desktop:text-[18px] desktop:text-[16px] mt-1 line-clamp-2 text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"desktop:mt-6 mt-4",children:(0,e.jsx)(s.Button,{as:"a",href:p,variant:"secondary",size:"lg",children:l?.learnMoreText||"Learn More"})})]})]})})},U=({searchValue:t,page:o})=>{const{copyWriting:l,locale:i="us"}=(0,_.useAiuiContext)(),p=(0,n.useMemo)(()=>`${i==="us"?"":`/${i}`}/${o?.handle}`,[o,i]);return(0,e.jsxs)("div",{className:"ipc_search_page_items border-b border-[#E4E5E6] py-6",children:[(0,e.jsx)(s.Heading,{size:3,html:(0,d.highlightSearchWord)(o?.name,t)}),(0,e.jsx)(s.Text,{as:"p",html:(0,d.highlightSearchWord)(o?.bodySummary||"",t),className:"lg-desktop:text-[18px] desktop:text-[16px] mt-1 text-sm font-bold leading-[1.4]"}),(0,e.jsx)(s.Button,{as:"a",href:p,variant:"secondary",size:"lg",className:"desktop:mt-6 mt-4",children:l?.learnMoreText||"Learn More"})]})},w=({url:t,label:o})=>(0,e.jsxs)("div",{className:"flex flex-col items-center justify-center gap-4",children:[(0,e.jsx)(s.Picture,{source:t,className:"h-[180px] w-[240px]",imgClassName:"object-cover"}),(0,e.jsx)(s.Text,{html:o,className:"desktop:text-[18px] text-sm font-bold leading-[1.4]"})]}),C=({products:t,title:o,buildProps:l,onSecondaryButton:i,onPrimaryButton:p})=>{const{products:y}=l||{};return(0,e.jsxs)("div",{className:"ipc_search_recommend_product tablet:pt-[80px] laptop:pt-[96px] desktop:pt-[112px] lg-desktop:pt-[128px] pt-[64px]",children:[(0,e.jsx)(s.Heading,{size:4,weight:"bold",html:o}),(0,e.jsx)("div",{className:" tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 mt-6 grid grid-cols-2 gap-x-3 gap-y-4",children:t?.map((r,x)=>{const g=y?.find(b=>b.handle===r.handle),k=g?.variants?.find(b=>b.sku===r.sku);return(0,e.jsx)(E,{product:g,variantData:k,onSecondaryButton:()=>i?.(),onPrimaryButton:()=>p?.()},r.sku+x)})})]})},H=({searchResult:t,searchValue:o,data:l,onSecondaryButton:i,onPrimaryButton:p,onChangeSort:y,loading:r,shopNowLoadingProductId:x,searchResultCount:g,onChangeTab:k,buildProps:b})=>{const[c,T]=(0,n.useState)(l?.tabs?.[0]),f=(0,n.useRef)(!1),[P,m]=(0,n.useState)(!1),[N,L]=(0,n.useState)({[v.SearchPageTabType.PRODUCTS]:l?.tabs?.find(a=>a.tabType===v.SearchPageTabType.PRODUCTS)?.sortKeys?.[0],[v.SearchPageTabType.BLOGS]:l?.tabs?.find(a=>a.tabType===v.SearchPageTabType.BLOGS)?.sortKeys?.[0],[v.SearchPageTabType.PAGES]:l?.tabs?.find(a=>a.tabType===v.SearchPageTabType.PAGES)?.sortKeys?.[0]}),h=(0,n.useMemo)(()=>t?.products||[],[t]),I=(0,n.useMemo)(()=>t?.blogs||[],[t]),B=(0,n.useMemo)(()=>t?.pages||[],[t]),A=(0,n.useMemo)(()=>Object.values(g||{}).reduce((a,u)=>a+u,0),[g]),M=(0,n.useMemo)(()=>{const a={advertisingBgImg:c?.advertisingBgImg,advertisingTitle:c?.advertisingTitle,advertisingSubtitle:c?.advertisingSubtitle,advertisingLink:c?.advertisingLink,advertisingTheme:c?.advertisingTheme,type:"advertising"};return!f.current&&h?.length&&(h?.length>=8?(h?.splice(7,0,a),f.current=!0):(h?.push(a),f.current=!0)),h},[c,h]);return(0,e.jsxs)("div",{className:"ipc_search_page desktop:py-[128px] tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-4 py-16",children:[(0,e.jsx)(s.Heading,{size:4,weight:"bold",html:l?.title?.replace("$totalCount",A?.toString())?.replace("$inputValue",`"${o}"`)}),(0,e.jsx)("div",{className:"mt-6",children:(0,e.jsxs)(s.Tabs,{className:"ipc_search_page_tabs",defaultValue:"products",children:[(0,e.jsxs)("div",{className:"desktop:flex desktop:items-center desktop:flex-row desktop:gap-6 desktop:justify-between",children:[(0,e.jsx)(s.TabsList,{children:l?.tabs?.map(a=>(0,e.jsxs)(s.TabsTrigger,{onClick:()=>{T(a),f.current=!1;const u=a?.sortKeys?.[0];u&&(L($=>({...$,[a?.tabType]:u})),y?.(a?.tabType,u)),k?.(a?.tabType)},defaultValue:"products",value:a.tabType,children:[a.label," (",g?.[a.tabType],")"]},a.id))}),(0,e.jsxs)(s.DropdownMenu,{onOpenChange:m,children:[(0,e.jsx)(s.DropdownMenuTrigger,{asChild:!0,children:(0,e.jsxs)("button",{className:"desktop:mt-0 mt-6 flex items-center text-base font-bold leading-[1.2]",children:[c?.sortLabel," ",N?.[c?.tabType]?.label," ",(0,e.jsx)(z.DownArrow,{className:(0,d.cn)("inline-block size-4",{"rotate-180":P})})]})}),(0,e.jsx)(s.DropdownMenuContent,{align:"start",sideOffset:8,className:"rounded-none bg-white !px-0 py-2",children:c?.sortKeys?.map(a=>(0,e.jsx)(s.DropdownMenuItem,{className:(0,d.cn)("laptop:px-4 laptop:text-base px-3 py-4 text-sm font-bold hover:bg-[#EAEAEC] hover:text-current",{"bg-[#EAEAEC]":N?.[c?.tabType]?.value===a.value}),onClick:()=>{f.current=!1,y?.(c?.tabType,a),L(u=>({...u,[c?.tabType]:a}))},children:a.label},a.id))})]})]}),(0,e.jsxs)(s.TabsContent,{value:v.SearchPageTabType.PRODUCTS,className:"ipc_search_page_tabs_products_content mt-6",children:[(0,e.jsx)("div",{className:"tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 grid grid-cols-2 gap-x-3 gap-y-4",children:M?.map((a,u)=>(0,e.jsx)(E,{searchValue:o,product:a,shopNowLoadingProductId:x,onSecondaryButton:()=>i?.(a),onPrimaryButton:()=>p?.(a)},(a.id||"")+u))}),r?(0,e.jsx)("div",{className:"mt-6 flex w-full justify-center",children:(0,e.jsx)(s.LoadingDots,{})}):!h?.length&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(w,{url:l?.noResultImage?.url,label:l?.noResultLabel}),(0,e.jsx)(C,{products:l?.recommendProducts||[],buildProps:b,title:l?.recommendProductsTitle,shopNowLoadingProductId:x})]})]}),(0,e.jsx)(s.TabsContent,{value:v.SearchPageTabType.BLOGS,className:"ipc_search_page_tabs_blogs_content",children:(0,e.jsxs)("div",{children:[I?.map(a=>(0,e.jsx)(W,{blog:a,searchValue:o},a.id)),r?(0,e.jsx)("div",{className:"mt-6 flex justify-center",children:(0,e.jsx)(s.LoadingDots,{})}):!I?.length&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(w,{url:l?.noResultImage?.url,label:l?.noResultLabel}),(0,e.jsx)(C,{products:l?.recommendProducts||[],buildProps:b,title:l?.recommendProductsTitle})]})]})}),(0,e.jsxs)(s.TabsContent,{value:v.SearchPageTabType.PAGES,className:"ipc_search_page_tabs_pages_content",children:[(0,e.jsx)("div",{children:B?.map((a,u)=>(0,e.jsx)(U,{page:a,searchValue:o},(a.global_id||a.id)+u))}),r?(0,e.jsx)("div",{className:"mt-6 flex justify-center",children:(0,e.jsx)(s.LoadingDots,{})}):!B?.length&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(w,{url:l?.noResultImage?.url,label:l?.noResultLabel}),(0,e.jsx)(C,{products:l?.recommendProducts||[],buildProps:b,title:l?.recommendProductsTitle,shopNowLoadingProductId:x})]})]})]})})]})};var q=H;
2
2
  //# sourceMappingURL=index.js.map
package/dist/cjs/biz-components/SearchPage/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/SearchPage/index.tsx"],
4
- "sourcesContent": ["import {\n Heading,\n Tabs,\n TabsList,\n TabsTrigger,\n TabsContent,\n Text,\n Picture,\n Link,\n Button,\n DropdownMenu,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuLabel,\n LoadingDots,\n} from '../../components/index.js'\nimport { DownArrow } from '../HeaderNavigation/icons/index.js'\nimport { useEffect, useMemo, useRef, useState } from 'react'\nimport { cn, atobID, highlightSearchWord } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport type {\n SearchPageProps,\n SortKey,\n SearchProductItemProps,\n SearchBlogItemProps,\n SearchPageItemProps,\n SearchRecommendProductsProps,\n} from './types'\nimport { SearchPageTabType } from './types.js'\n\n/**\n * \u641C\u7D22\u5546\u54C1\n */\nconst SearchProductItem = ({\n product,\n onSecondaryButton,\n onPrimaryButton,\n searchValue,\n variantData,\n}: SearchProductItemProps) => {\n const variant = useMemo(() => variantData || product?.variants?.[0], [product, variantData])\n const { locale = 'us', copyWriting } = useAiuiContext()\n\n const listingLink = useMemo(() => {\n return `${locale === 'us' ? '' : '/' + locale}/products/${product?.handle}?variant=${atobID(variant?.id as string)}?ref=search_result_${searchValue?.toLowerCase()}`\n }, [product?.handle, variant?.id, searchValue])\n\n const coupon = variant?.coupons?.[0]\n\n const { price, basePrice } = formatVariantPrice({\n locale: locale,\n amount: coupon ? coupon.variant_price4wscode : variant?.price,\n baseAmount: coupon ? variant?.price : 0,\n currencyCode: product?.price?.currencyCode || 'USD',\n })\n\n const tags = useMemo(() => {\n return product?.tags\n ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, 2)\n }, [product?.tags])\n\n return (\n <div className=\"ipc_search_product_item lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[360px] relative h-auto\">\n {product?.type === 'advertising' ? (\n <Link href={product?.advertisingLink} className=\"h-full\">\n <Picture\n source={product?.advertisingBgImg?.url}\n className=\"size-full\"\n imgClassName=\"size-full object-cover\"\n />\n <div className=\"desktop:p-6 absolute inset-0 z-[2] p-4 [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Text html={product?.advertisingTitle} className=\"desktop:text-[18px] text-sm font-bold text-white\" />\n <Heading\n size={3}\n html={product?.advertisingSubtitle}\n className=\"laptop:line-clamp-3 mt-2 line-clamp-4 font-bold text-white\"\n />\n </div>\n </Link>\n ) : (\n <a\n href={listingLink}\n className=\" tablet:hover:bg-info-white desktop:p-6 desktop:pt-4 tablet:p-4 flex h-full flex-col bg-[#EAEAEC] px-2 py-4 no-underline duration-300\"\n >\n <div className=\"ipc_search_product_item_image\">\n <Picture\n className=\"lg-desktop:size-[196px] mx-auto size-[138px]\"\n source={`${variant?.image?.url || product?.images?.[0]?.url}}`}\n alt={product.title}\n imgClassName=\"object-cover size-full\"\n />\n </div>\n <div className=\"ipc_search_product_item_content desktop:mt-2 lg-desktop:mt-3 desktop:gap-6 mt-1 flex flex-1 flex-col justify-between gap-4\">\n <div className=\"flex-1\">\n <div className=\"lg-desktop:h-[28px] mb-2 flex h-[24px] gap-2\">\n {tags?.map((tag: string, index: number) => (\n <Text\n key={index}\n as=\"p\"\n html={tag}\n className=\"text-brand-0 lg-desktop:px-2 lg-desktop:!leading-[28px] h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[24px]\"\n />\n ))}\n </div>\n <Text\n className=\"desktop:text-2xl tablet:line-clamp-2 line-clamp-3 text-xl font-bold !leading-[1.2]\"\n weight=\"bold\"\n html={highlightSearchWord(product?.title || '', searchValue || '')}\n />\n <Text\n as=\"p\"\n className=\"lg-desktop:text-[18px] tablet:line-clamp-1 mt-1 line-clamp-2 text-sm font-bold\"\n html={highlightSearchWord(product.description, searchValue || '')}\n />\n </div>\n <div>\n <div className=\"mb-2 flex items-center\">\n {!variant?.availableForSale ? (\n <div className=\"text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold\">\n {copyWriting?.soldOutText || 'Sold Out'}\n </div>\n ) : (\n <>\n <div className=\"final-price text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold\">\n {variant?.availableForSale ? price || '' : ''}\n </div>\n <div className=\"origin-price tablet:text-xl lg-desktop:text-2xl text-info-secondary ml-1 text-[18px] font-bold line-through\">\n {variant?.availableForSale ? basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n <div\n className={cn(\n 'ipc_search_product_item_button_group',\n 'lg-desktop:gap-3 laptop:flex-row flex flex-col items-center gap-2'\n )}\n >\n {copyWriting?.learnMoreText && (\n <Button\n variant=\"secondary\"\n className=\"laptop:w-auto w-full\"\n size=\"lg\"\n disabled={!variant?.availableForSale}\n onClick={() => onSecondaryButton?.()}\n >\n {copyWriting?.learnMoreText}\n </Button>\n )}\n {copyWriting?.shopNowText && (\n <Button\n variant=\"primary\"\n className=\"laptop:w-auto w-full\"\n size=\"lg\"\n disabled={!variant?.availableForSale}\n onClick={() => onPrimaryButton?.()}\n >\n {copyWriting?.shopNowText}\n </Button>\n )}\n </div>\n </div>\n </div>\n </a>\n )}\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u6587\u7AE0\n */\nconst SearchBlogItem = ({ blog, searchValue }: SearchBlogItemProps) => {\n const { copyWriting, locale } = useAiuiContext()\n\n const articleLink = useMemo(\n () =>\n `${locale === 'us' ? '' : '/' + locale}/blogs/${blog?.blog?.handle}/${blog?.handle.replace('storefront-', '')}`,\n [blog, locale]\n )\n\n return (\n <div className=\"ipc_search_blog_item border-b border-[#E4E5E6] py-6\">\n <div className=\"ipc_search_blog_item_content laptop:flex-row-reverse laptop:gap-8 desktop:gap-16 flex flex-col gap-4\">\n <div className=\"laptop:flex-[440] desktop:flex-[540] desktop:h-[280px] h-[240px]\">\n <Picture\n source={blog?.image?.url}\n className=\"size-full\"\n imgClassName=\"size-full object-cover\"\n alt={blog?.title}\n />\n </div>\n <div className=\"laptop:flex-[424] desktop:flex-[704] lg-desktop:flex-[1056] flex flex-col justify-center\">\n <Heading size={3} html={highlightSearchWord(blog?.title, searchValue)} />\n <Text\n html={highlightSearchWord(blog?.content, searchValue)}\n className=\"lg-desktop:text-[18px] desktop:text-[16px] mt-1 line-clamp-2 text-sm font-bold leading-[1.4]\"\n />\n <div className=\"desktop:mt-6 mt-4\">\n <Button as=\"a\" href={articleLink} variant=\"secondary\" size=\"lg\">\n {copyWriting?.learnMoreText || 'Learn More'}\n </Button>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u9875\u9762\n */\nconst SearchPageItem = ({ searchValue, page }: SearchPageItemProps) => {\n const { copyWriting, locale = 'us' } = useAiuiContext()\n const pageLink = useMemo(() => `${locale === 'us' ? '' : `/${locale}`}/${page?.handle}`, [page, locale])\n return (\n <div className=\"ipc_search_page_items border-b border-[#E4E5E6] py-6\">\n <Heading size={3} html={highlightSearchWord(page?.name, searchValue)} />\n <Text\n as=\"p\"\n html={highlightSearchWord(page?.bodySummary || '', searchValue)}\n className=\"lg-desktop:text-[18px] desktop:text-[16px] mt-1 text-sm font-bold leading-[1.4]\"\n />\n <Button as=\"a\" href={pageLink} variant=\"secondary\" size=\"lg\" className=\"desktop:mt-6 mt-4\">\n {copyWriting?.learnMoreText || 'Learn More'}\n </Button>\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u7ED3\u679C\u4E3A\u7A7A\n */\nconst SearchPageNoResult = ({ url, label }: { url: string; label: string }) => {\n return (\n <div className=\"flex flex-col items-center justify-center gap-4\">\n <Picture source={url} className=\"h-[180px] w-[240px]\" imgClassName=\"object-cover\" />\n <Text html={label} className=\"desktop:text-[18px] text-sm font-bold leading-[1.4]\" />\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u63A8\u8350\u5546\u54C1\n */\nconst SearchRecommendProducts = ({\n products,\n title,\n buildProps,\n onSecondaryButton,\n onPrimaryButton,\n}: SearchRecommendProductsProps) => {\n const { products: buildProducts } = buildProps || {}\n return (\n <div className=\"ipc_search_recommend_product tablet:pt-[80px] laptop:pt-[96px] desktop:pt-[112px] lg-desktop:pt-[128px] pt-[64px]\">\n <Heading size={4} weight=\"bold\" html={title} />\n <div className=\" tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 mt-6 grid grid-cols-2 gap-x-3 gap-y-4\">\n {products?.map((product: any, index: number) => {\n const buildProduct = buildProducts?.find((buildProduct: any) => buildProduct.handle === product.handle)\n const variant = buildProduct?.variants?.find((variant: any) => variant.sku === product.sku)\n return (\n <SearchProductItem\n product={buildProduct}\n variantData={variant}\n key={product.id + index}\n onSecondaryButton={() => onSecondaryButton?.()}\n onPrimaryButton={() => onPrimaryButton?.()}\n />\n )\n })}\n </div>\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u9875\u9762\n */\nconst SearchPage = ({\n searchResult,\n searchValue,\n data,\n onSecondaryButton,\n onPrimaryButton,\n // loadMore,\n onChangeSort,\n loading,\n searchResultCount,\n onChangeTab,\n buildProps,\n}: SearchPageProps) => {\n const [currentTab, setCurrentTab] = useState<any>(data?.tabs?.[0])\n const isInsertAdvertising = useRef(false)\n const [isOpenSort, setIsOpenSort] = useState(false)\n const [currentSortKey, setCurrentSortKey] = useState<any>({\n [SearchPageTabType.PRODUCTS]: data?.tabs?.find((tab: any) => tab.tabType === SearchPageTabType.PRODUCTS)\n ?.sortKeys?.[0],\n [SearchPageTabType.BLOGS]: data?.tabs?.find((tab: any) => tab.tabType === SearchPageTabType.BLOGS)?.sortKeys?.[0],\n [SearchPageTabType.PAGES]: data?.tabs?.find((tab: any) => tab.tabType === SearchPageTabType.PAGES)?.sortKeys?.[0],\n })\n\n const searchProductsResult = useMemo(() => {\n return searchResult?.products || []\n }, [searchResult])\n\n const searchBlogsResult = useMemo(() => {\n return searchResult?.blogs || []\n }, [searchResult])\n\n const searchPagesResult = useMemo(() => {\n return searchResult?.pages || []\n }, [searchResult])\n\n const totalCount = useMemo(() => {\n return Object.values(searchResultCount || {}).reduce((acc, curr) => acc + curr, 0)\n }, [searchResultCount])\n\n const searchProductsResultWithAdvertising = useMemo(() => {\n const advertisingData = {\n advertisingBgImg: currentTab?.advertisingBgImg,\n advertisingTitle: currentTab?.advertisingTitle,\n advertisingSubtitle: currentTab?.advertisingSubtitle,\n advertisingLink: currentTab?.advertisingLink,\n type: 'advertising',\n }\n if (!isInsertAdvertising.current && !!searchProductsResult?.length) {\n if (searchProductsResult?.length >= 8) {\n searchProductsResult?.splice(7, 0, advertisingData)\n isInsertAdvertising.current = true\n } else {\n searchProductsResult?.push(advertisingData)\n isInsertAdvertising.current = true\n }\n }\n return searchProductsResult\n }, [currentTab, searchProductsResult])\n\n return (\n <div className=\"ipc_search_page desktop:py-[128px] tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-4 py-16\">\n <Heading\n size={4}\n weight=\"bold\"\n html={data?.title?.replace('$totalCount', totalCount?.toString())?.replace('$inputValue', `\"${searchValue}\"`)}\n />\n <div className=\"mt-6\">\n <Tabs className=\"ipc_search_page_tabs\" defaultValue=\"products\">\n <div className=\"desktop:flex desktop:items-center desktop:flex-row desktop:gap-6 desktop:justify-between\">\n <TabsList>\n {data?.tabs?.map((tab: any) => (\n <TabsTrigger\n onClick={() => {\n setCurrentTab(tab)\n // \u5207\u6362tab\u65F6\uFF0C\u91CD\u7F6E\u8BE5tab\u7684\u6392\u5E8F\u503C\u4E3A\u9ED8\u8BA4\u503C\uFF08\u7B2C\u4E00\u4E2AsortKey\uFF09\n const defaultSortKey = tab?.sortKeys?.[0]\n if (defaultSortKey) {\n setCurrentSortKey((prev: any) => ({\n ...prev,\n [tab?.tabType]: defaultSortKey,\n }))\n onChangeSort?.(tab?.tabType, defaultSortKey)\n }\n onChangeTab?.(tab?.tabType)\n }}\n key={tab.id}\n defaultValue=\"products\"\n value={tab.tabType}\n >\n {tab.label} ({searchResultCount?.[tab.tabType as keyof typeof searchResultCount]})\n </TabsTrigger>\n ))}\n </TabsList>\n <DropdownMenu onOpenChange={setIsOpenSort}>\n <DropdownMenuTrigger asChild>\n <button className=\"desktop:mt-0 mt-6 flex items-center text-base font-bold leading-[1.2]\">\n {currentTab?.sortLabel} {currentSortKey?.[currentTab?.tabType]?.label}{' '}\n <DownArrow\n className={cn('inline-block size-4', {\n 'rotate-180': isOpenSort,\n })}\n />\n </button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" sideOffset={8} className=\"rounded-none bg-white !px-0 py-2\">\n {currentTab?.sortKeys?.map((sortKey: SortKey) => {\n return (\n <DropdownMenuItem\n className={cn(\n 'laptop:px-4 laptop:text-base px-3 py-4 text-sm font-bold hover:bg-[#EAEAEC] hover:text-current',\n {\n 'bg-[#EAEAEC]': currentSortKey?.[currentTab?.tabType]?.value === sortKey.value,\n }\n )}\n onClick={() => {\n isInsertAdvertising.current = false\n onChangeSort?.(currentTab?.tabType, sortKey)\n setCurrentSortKey((prev: any) => ({\n ...prev,\n [currentTab?.tabType]: sortKey,\n }))\n }}\n key={sortKey.id}\n >\n {sortKey.label}\n </DropdownMenuItem>\n )\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n <TabsContent value={SearchPageTabType.PRODUCTS} className=\"ipc_search_page_tabs_products_content mt-6\">\n <div className=\"tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 grid grid-cols-2 gap-x-3 gap-y-4\">\n {searchProductsResultWithAdvertising?.map((product: any, index: number) => (\n <SearchProductItem\n searchValue={searchValue}\n key={(product.id || '') + index}\n product={product}\n onSecondaryButton={() => onSecondaryButton?.(product)}\n onPrimaryButton={() => onPrimaryButton?.(product)}\n />\n ))}\n </div>\n {loading ? (\n <div className=\"mt-6 flex w-full justify-center\">\n <LoadingDots />\n </div>\n ) : (\n !searchProductsResult?.length && (\n <>\n <SearchPageNoResult url={data?.noResultImage?.url} label={data?.noResultLabel} />\n <SearchRecommendProducts\n products={data?.recommendProducts || []}\n buildProps={buildProps}\n title={data?.recommendProductsTitle}\n />\n </>\n )\n )}\n </TabsContent>\n <TabsContent value={SearchPageTabType.BLOGS} className=\"ipc_search_page_tabs_blogs_content\">\n <div>\n {searchBlogsResult?.map((blog: any) => (\n <SearchBlogItem key={blog.id} blog={blog} searchValue={searchValue} />\n ))}\n {loading ? (\n <div className=\"mt-6 flex justify-center\">\n <LoadingDots />\n </div>\n ) : (\n !searchBlogsResult?.length && (\n <>\n <SearchPageNoResult url={data?.noResultImage?.url} label={data?.noResultLabel} />\n <SearchRecommendProducts\n products={data?.recommendProducts || []}\n buildProps={buildProps}\n title={data?.recommendProductsTitle}\n />\n </>\n )\n )}\n </div>\n </TabsContent>\n <TabsContent value={SearchPageTabType.PAGES} className=\"ipc_search_page_tabs_pages_content\">\n <div>\n {searchPagesResult?.map((page: any, index: number) => (\n <SearchPageItem key={(page.global_id || page.id) + index} page={page} searchValue={searchValue} />\n ))}\n </div>\n {loading ? (\n <div className=\"mt-6 flex justify-center\">\n <LoadingDots />\n </div>\n ) : (\n !searchPagesResult?.length && (\n <>\n <SearchPageNoResult url={data?.noResultImage?.url} label={data?.noResultLabel} />\n <SearchRecommendProducts\n products={data?.recommendProducts || []}\n buildProps={buildProps}\n title={data?.recommendProductsTitle}\n />\n </>\n )\n )}\n </TabsContent>\n </Tabs>\n </div>\n </div>\n )\n}\n\nexport default SearchPage\n"],
5
- "mappings": "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",
6
- "names": ["SearchPage_exports", "__export", "SearchPage_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_icons", "import_react", "import_utils", "import_AiuiProvider", "import_shelfDisplay", "import_types", "SearchProductItem", "product", "onSecondaryButton", "onPrimaryButton", "searchValue", "variantData", "variant", "locale", "copyWriting", "listingLink", "coupon", "price", "basePrice", "tags", "item", "tag", "index", "SearchBlogItem", "blog", "articleLink", "SearchPageItem", "page", "pageLink", "SearchPageNoResult", "url", "label", "SearchRecommendProducts", "products", "title", "buildProps", "buildProducts", "buildProduct", "SearchPage", "searchResult", "data", "onChangeSort", "loading", "searchResultCount", "onChangeTab", "currentTab", "setCurrentTab", "isInsertAdvertising", "isOpenSort", "setIsOpenSort", "currentSortKey", "setCurrentSortKey", "tab", "searchProductsResult", "searchBlogsResult", "searchPagesResult", "totalCount", "acc", "curr", "searchProductsResultWithAdvertising", "advertisingData", "defaultSortKey", "prev", "sortKey"]
4
+ "sourcesContent": ["import {\n Heading,\n Tabs,\n TabsList,\n TabsTrigger,\n TabsContent,\n Text,\n Picture,\n Link,\n Button,\n DropdownMenu,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuItem,\n LoadingDots,\n} from '../../components/index.js'\nimport { DownArrow } from '../HeaderNavigation/icons/index.js'\nimport { useMemo, useRef, useState } from 'react'\nimport { cn, atobID, highlightSearchWord } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from '../ShelfDisplay/shelfDisplay.js'\nimport type {\n SearchPageProps,\n SortKey,\n SearchProductItemProps,\n SearchBlogItemProps,\n SearchPageItemProps,\n SearchRecommendProductsProps,\n} from './types'\nimport { SearchPageTabType } from './types.js'\n\n/**\n * \u641C\u7D22\u5546\u54C1\n */\nconst SearchProductItem = ({\n product,\n onSecondaryButton,\n onPrimaryButton,\n searchValue,\n variantData,\n shopNowLoadingProductId,\n}: SearchProductItemProps) => {\n const variant = useMemo(() => variantData || product?.variants?.[0], [product, variantData])\n const { locale = 'us', copyWriting } = useAiuiContext()\n\n // \u5224\u65AD\u5F53\u524D\u4EA7\u54C1\u662F\u5426\u5728\u52A0\u8F7D\u4E2D\n const isCurrentProductLoading = shopNowLoadingProductId === product?.id\n\n const listingLink = useMemo(() => {\n return `${locale === 'us' ? '' : '/' + locale}/products/${product?.handle}?variant=${atobID(variant?.id as string)}?ref=search_result_${searchValue?.toLowerCase()}`\n }, [product?.handle, variant?.id, searchValue, locale])\n\n const coupon = variant?.coupons?.[0]\n\n const { price, basePrice } = formatVariantPrice({\n locale: locale,\n amount: coupon ? coupon.variant_price4wscode : variant?.price,\n baseAmount: coupon ? variant?.price : 0,\n currencyCode: product?.price?.currencyCode || 'USD',\n })\n\n const tags = useMemo(() => {\n return product?.tags\n ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, 2)\n }, [product?.tags])\n\n return (\n <div className=\"ipc_search_product_item lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[360px] relative h-auto\">\n {product?.type === 'advertising' && product?.advertisingLink ? (\n <Link href={product?.advertisingLink} className=\"h-full\">\n <Picture\n source={product?.advertisingBgImg?.url}\n className=\"size-full\"\n imgClassName=\"size-full object-cover\"\n />\n <div className=\"desktop:p-6 absolute inset-0 z-[2] p-4 [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n <Text\n html={product?.advertisingTitle}\n className={cn('desktop:text-[18px] text-sm font-bold', {\n 'text-white': product?.advertisingTheme === 'light',\n 'text-info-primary': product?.advertisingTheme === 'dark',\n })}\n />\n {product?.advertisingSubtitle && (\n <Heading\n size={3}\n html={product?.advertisingSubtitle}\n className={cn('laptop:line-clamp-3 mt-2 line-clamp-4 font-bold', {\n 'text-white': product?.advertisingTheme === 'light',\n 'text-info-primary': product?.advertisingTheme === 'dark',\n })}\n />\n )}\n </div>\n </Link>\n ) : (\n <a\n href={listingLink}\n className=\" tablet:hover:bg-info-white desktop:p-6 desktop:pt-4 tablet:p-4 flex h-full flex-col bg-[#EAEAEC] px-2 py-4 no-underline duration-300\"\n >\n <div className=\"ipc_search_product_item_image\">\n <Picture\n className=\"lg-desktop:size-[196px] mx-auto size-[138px]\"\n source={`${variant?.image?.url || product?.images?.[0]?.url}}`}\n alt={product?.title}\n imgClassName=\"object-cover size-full\"\n />\n </div>\n <div className=\"ipc_search_product_item_content desktop:mt-2 lg-desktop:mt-3 desktop:gap-6 mt-1 flex flex-1 flex-col justify-between gap-4\">\n <div className=\"flex-1\">\n <div className=\"lg-desktop:h-[28px] mb-2 flex h-[24px] gap-2\">\n {tags?.map((tag: string, index: number) => (\n <Text\n key={index}\n as=\"p\"\n html={tag}\n className=\"text-brand-0 lg-desktop:px-2 lg-desktop:!leading-[28px] h-full rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]\"\n />\n ))}\n </div>\n <Text\n className=\"lg-desktop:text-2xl tablet:line-clamp-2 line-clamp-3 text-xl font-bold !leading-[1.2]\"\n weight=\"bold\"\n html={highlightSearchWord(product?.title || '', searchValue || '')}\n />\n <Text\n as=\"p\"\n className=\"lg-desktop:text-[18px] tablet:line-clamp-1 mt-1 line-clamp-2 text-sm font-bold\"\n html={highlightSearchWord(product?.description, searchValue || '')}\n />\n </div>\n <div>\n <div className=\"mb-2 flex items-center\">\n {!variant?.availableForSale ? (\n <div className=\"text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold\">\n {copyWriting?.soldOutText || 'Sold Out'}\n </div>\n ) : (\n <>\n <div className=\"final-price text-info-primary tablet:text-xl lg-desktop:text-2xl text-[18px] font-bold\">\n {variant?.availableForSale ? price || '' : ''}\n </div>\n <div className=\"origin-price tablet:text-xl lg-desktop:text-2xl text-info-secondary ml-1 text-[18px] font-bold line-through\">\n {variant?.availableForSale ? basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n <div\n className={cn(\n 'ipc_search_product_item_button_group',\n 'lg-desktop:gap-3 laptop:flex-row flex flex-col items-center gap-2'\n )}\n >\n {copyWriting?.learnMoreText && (\n <Button\n variant=\"secondary\"\n className=\"laptop:w-auto w-full\"\n size=\"lg\"\n disabled={!variant?.availableForSale}\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n onSecondaryButton?.()\n }}\n >\n {copyWriting?.learnMoreText}\n </Button>\n )}\n {copyWriting?.shopNowText && (\n <Button\n variant=\"primary\"\n className=\"laptop:w-auto w-full\"\n size=\"lg\"\n disabled={!variant?.availableForSale}\n loading={isCurrentProductLoading}\n onClick={e => {\n e.preventDefault()\n e.stopPropagation()\n onPrimaryButton?.()\n }}\n >\n {copyWriting?.shopNowText}\n </Button>\n )}\n </div>\n </div>\n </div>\n </a>\n )}\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u6587\u7AE0\n */\nconst SearchBlogItem = ({ blog, searchValue }: SearchBlogItemProps) => {\n const { copyWriting, locale } = useAiuiContext()\n\n const articleLink = useMemo(\n () =>\n `${locale === 'us' ? '' : '/' + locale}/blogs/${blog?.blog?.handle}/${blog?.handle.replace('storefront-', '')}`,\n [blog, locale]\n )\n\n return (\n <div className=\"ipc_search_blog_item border-b border-[#E4E5E6] py-6\">\n <div className=\"ipc_search_blog_item_content laptop:flex-row-reverse laptop:gap-8 desktop:gap-16 flex flex-col gap-4\">\n <div className=\"laptop:flex-[440] desktop:flex-[540] desktop:h-[280px] h-[240px]\">\n <Picture\n source={blog?.image?.url}\n className=\"size-full\"\n imgClassName=\"size-full object-cover\"\n alt={blog?.title}\n />\n </div>\n <div className=\"laptop:flex-[424] desktop:flex-[704] lg-desktop:flex-[1056] flex flex-col justify-center\">\n <Heading size={3} html={highlightSearchWord(blog?.title, searchValue)} />\n <Text\n html={highlightSearchWord(blog?.content, searchValue)}\n className=\"lg-desktop:text-[18px] desktop:text-[16px] mt-1 line-clamp-2 text-sm font-bold leading-[1.4]\"\n />\n <div className=\"desktop:mt-6 mt-4\">\n <Button as=\"a\" href={articleLink} variant=\"secondary\" size=\"lg\">\n {copyWriting?.learnMoreText || 'Learn More'}\n </Button>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u9875\u9762\n */\nconst SearchPageItem = ({ searchValue, page }: SearchPageItemProps) => {\n const { copyWriting, locale = 'us' } = useAiuiContext()\n const pageLink = useMemo(() => `${locale === 'us' ? '' : `/${locale}`}/${page?.handle}`, [page, locale])\n return (\n <div className=\"ipc_search_page_items border-b border-[#E4E5E6] py-6\">\n <Heading size={3} html={highlightSearchWord(page?.name, searchValue)} />\n <Text\n as=\"p\"\n html={highlightSearchWord(page?.bodySummary || '', searchValue)}\n className=\"lg-desktop:text-[18px] desktop:text-[16px] mt-1 text-sm font-bold leading-[1.4]\"\n />\n <Button as=\"a\" href={pageLink} variant=\"secondary\" size=\"lg\" className=\"desktop:mt-6 mt-4\">\n {copyWriting?.learnMoreText || 'Learn More'}\n </Button>\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u7ED3\u679C\u4E3A\u7A7A\n */\nconst SearchPageNoResult = ({ url, label }: { url: string; label: string }) => {\n return (\n <div className=\"flex flex-col items-center justify-center gap-4\">\n <Picture source={url} className=\"h-[180px] w-[240px]\" imgClassName=\"object-cover\" />\n <Text html={label} className=\"desktop:text-[18px] text-sm font-bold leading-[1.4]\" />\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u63A8\u8350\u5546\u54C1\n */\nconst SearchRecommendProducts = ({\n products,\n title,\n buildProps,\n onSecondaryButton,\n onPrimaryButton,\n}: SearchRecommendProductsProps) => {\n const { products: buildProducts } = buildProps || {}\n return (\n <div className=\"ipc_search_recommend_product tablet:pt-[80px] laptop:pt-[96px] desktop:pt-[112px] lg-desktop:pt-[128px] pt-[64px]\">\n <Heading size={4} weight=\"bold\" html={title} />\n <div className=\" tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 mt-6 grid grid-cols-2 gap-x-3 gap-y-4\">\n {products?.map((product: any, index: number) => {\n const buildProduct = buildProducts?.find((buildProduct: any) => buildProduct.handle === product.handle)\n const variant = buildProduct?.variants?.find((variant: any) => variant.sku === product.sku)\n return (\n <SearchProductItem\n product={buildProduct}\n variantData={variant}\n key={product.sku + index}\n onSecondaryButton={() => onSecondaryButton?.()}\n onPrimaryButton={() => onPrimaryButton?.()}\n />\n )\n })}\n </div>\n </div>\n )\n}\n\n/**\n * \u641C\u7D22\u9875\u9762\n */\nconst SearchPage = ({\n searchResult,\n searchValue,\n data,\n onSecondaryButton,\n onPrimaryButton,\n // loadMore,\n onChangeSort,\n loading,\n shopNowLoadingProductId,\n searchResultCount,\n onChangeTab,\n buildProps,\n}: SearchPageProps) => {\n const [currentTab, setCurrentTab] = useState<any>(data?.tabs?.[0])\n const isInsertAdvertising = useRef(false)\n const [isOpenSort, setIsOpenSort] = useState(false)\n const [currentSortKey, setCurrentSortKey] = useState<any>({\n [SearchPageTabType.PRODUCTS]: data?.tabs?.find((tab: any) => tab.tabType === SearchPageTabType.PRODUCTS)\n ?.sortKeys?.[0],\n [SearchPageTabType.BLOGS]: data?.tabs?.find((tab: any) => tab.tabType === SearchPageTabType.BLOGS)?.sortKeys?.[0],\n [SearchPageTabType.PAGES]: data?.tabs?.find((tab: any) => tab.tabType === SearchPageTabType.PAGES)?.sortKeys?.[0],\n })\n\n const searchProductsResult = useMemo(() => {\n return searchResult?.products || []\n }, [searchResult])\n\n const searchBlogsResult = useMemo(() => {\n return searchResult?.blogs || []\n }, [searchResult])\n\n const searchPagesResult = useMemo(() => {\n return searchResult?.pages || []\n }, [searchResult])\n\n const totalCount = useMemo(() => {\n return Object.values(searchResultCount || {}).reduce((acc, curr) => acc + curr, 0)\n }, [searchResultCount])\n\n const searchProductsResultWithAdvertising = useMemo(() => {\n const advertisingData = {\n advertisingBgImg: currentTab?.advertisingBgImg,\n advertisingTitle: currentTab?.advertisingTitle,\n advertisingSubtitle: currentTab?.advertisingSubtitle,\n advertisingLink: currentTab?.advertisingLink,\n advertisingTheme: currentTab?.advertisingTheme,\n type: 'advertising',\n }\n if (!isInsertAdvertising.current && !!searchProductsResult?.length) {\n if (searchProductsResult?.length >= 8) {\n searchProductsResult?.splice(7, 0, advertisingData)\n isInsertAdvertising.current = true\n } else {\n searchProductsResult?.push(advertisingData)\n isInsertAdvertising.current = true\n }\n }\n return searchProductsResult\n }, [currentTab, searchProductsResult])\n\n return (\n <div className=\"ipc_search_page desktop:py-[128px] tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-4 py-16\">\n <Heading\n size={4}\n weight=\"bold\"\n html={data?.title?.replace('$totalCount', totalCount?.toString())?.replace('$inputValue', `\"${searchValue}\"`)}\n />\n <div className=\"mt-6\">\n <Tabs className=\"ipc_search_page_tabs\" defaultValue=\"products\">\n <div className=\"desktop:flex desktop:items-center desktop:flex-row desktop:gap-6 desktop:justify-between\">\n <TabsList>\n {data?.tabs?.map((tab: any) => (\n <TabsTrigger\n onClick={() => {\n setCurrentTab(tab)\n isInsertAdvertising.current = false\n // \u5207\u6362tab\u65F6\uFF0C\u91CD\u7F6E\u8BE5tab\u7684\u6392\u5E8F\u503C\u4E3A\u9ED8\u8BA4\u503C\uFF08\u7B2C\u4E00\u4E2AsortKey\uFF09\n const defaultSortKey = tab?.sortKeys?.[0]\n if (defaultSortKey) {\n setCurrentSortKey((prev: any) => ({\n ...prev,\n [tab?.tabType]: defaultSortKey,\n }))\n onChangeSort?.(tab?.tabType, defaultSortKey)\n }\n onChangeTab?.(tab?.tabType)\n }}\n key={tab.id}\n defaultValue=\"products\"\n value={tab.tabType}\n >\n {tab.label} ({searchResultCount?.[tab.tabType as keyof typeof searchResultCount]})\n </TabsTrigger>\n ))}\n </TabsList>\n <DropdownMenu onOpenChange={setIsOpenSort}>\n <DropdownMenuTrigger asChild>\n <button className=\"desktop:mt-0 mt-6 flex items-center text-base font-bold leading-[1.2]\">\n {currentTab?.sortLabel} {currentSortKey?.[currentTab?.tabType]?.label}{' '}\n <DownArrow\n className={cn('inline-block size-4', {\n 'rotate-180': isOpenSort,\n })}\n />\n </button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\" sideOffset={8} className=\"rounded-none bg-white !px-0 py-2\">\n {currentTab?.sortKeys?.map((sortKey: SortKey) => {\n return (\n <DropdownMenuItem\n className={cn(\n 'laptop:px-4 laptop:text-base px-3 py-4 text-sm font-bold hover:bg-[#EAEAEC] hover:text-current',\n {\n 'bg-[#EAEAEC]': currentSortKey?.[currentTab?.tabType]?.value === sortKey.value,\n }\n )}\n onClick={() => {\n isInsertAdvertising.current = false\n onChangeSort?.(currentTab?.tabType, sortKey)\n setCurrentSortKey((prev: any) => ({\n ...prev,\n [currentTab?.tabType]: sortKey,\n }))\n }}\n key={sortKey.id}\n >\n {sortKey.label}\n </DropdownMenuItem>\n )\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n <TabsContent value={SearchPageTabType.PRODUCTS} className=\"ipc_search_page_tabs_products_content mt-6\">\n <div className=\"tablet:grid-cols-3 desktop:grid-cols-4 desktop:gap-4 grid grid-cols-2 gap-x-3 gap-y-4\">\n {searchProductsResultWithAdvertising?.map((product: any, index: number) => (\n <SearchProductItem\n searchValue={searchValue}\n key={(product.id || '') + index}\n product={product}\n shopNowLoadingProductId={shopNowLoadingProductId}\n onSecondaryButton={() => onSecondaryButton?.(product)}\n onPrimaryButton={() => onPrimaryButton?.(product)}\n />\n ))}\n </div>\n {loading ? (\n <div className=\"mt-6 flex w-full justify-center\">\n <LoadingDots />\n </div>\n ) : (\n !searchProductsResult?.length && (\n <>\n <SearchPageNoResult url={data?.noResultImage?.url} label={data?.noResultLabel} />\n <SearchRecommendProducts\n products={data?.recommendProducts || []}\n buildProps={buildProps}\n title={data?.recommendProductsTitle}\n shopNowLoadingProductId={shopNowLoadingProductId}\n />\n </>\n )\n )}\n </TabsContent>\n <TabsContent value={SearchPageTabType.BLOGS} className=\"ipc_search_page_tabs_blogs_content\">\n <div>\n {searchBlogsResult?.map((blog: any) => (\n <SearchBlogItem key={blog.id} blog={blog} searchValue={searchValue} />\n ))}\n {loading ? (\n <div className=\"mt-6 flex justify-center\">\n <LoadingDots />\n </div>\n ) : (\n !searchBlogsResult?.length && (\n <>\n <SearchPageNoResult url={data?.noResultImage?.url} label={data?.noResultLabel} />\n <SearchRecommendProducts\n products={data?.recommendProducts || []}\n buildProps={buildProps}\n title={data?.recommendProductsTitle}\n />\n </>\n )\n )}\n </div>\n </TabsContent>\n <TabsContent value={SearchPageTabType.PAGES} className=\"ipc_search_page_tabs_pages_content\">\n <div>\n {searchPagesResult?.map((page: any, index: number) => (\n <SearchPageItem key={(page.global_id || page.id) + index} page={page} searchValue={searchValue} />\n ))}\n </div>\n {loading ? (\n <div className=\"mt-6 flex justify-center\">\n <LoadingDots />\n </div>\n ) : (\n !searchPagesResult?.length && (\n <>\n <SearchPageNoResult url={data?.noResultImage?.url} label={data?.noResultLabel} />\n <SearchRecommendProducts\n products={data?.recommendProducts || []}\n buildProps={buildProps}\n title={data?.recommendProductsTitle}\n shopNowLoadingProductId={shopNowLoadingProductId}\n />\n </>\n )\n )}\n </TabsContent>\n </Tabs>\n </div>\n </div>\n )\n}\n\nexport default SearchPage\n"],
5
+ "mappings": "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",
6
+ "names": ["SearchPage_exports", "__export", "SearchPage_default", "__toCommonJS", "import_jsx_runtime", "import_components", "import_icons", "import_react", "import_utils", "import_AiuiProvider", "import_shelfDisplay", "import_types", "SearchProductItem", "product", "onSecondaryButton", "onPrimaryButton", "searchValue", "variantData", "shopNowLoadingProductId", "variant", "locale", "copyWriting", "isCurrentProductLoading", "listingLink", "coupon", "price", "basePrice", "tags", "item", "tag", "index", "e", "SearchBlogItem", "blog", "articleLink", "SearchPageItem", "page", "pageLink", "SearchPageNoResult", "url", "label", "SearchRecommendProducts", "products", "title", "buildProps", "buildProducts", "buildProduct", "SearchPage", "searchResult", "data", "onChangeSort", "loading", "searchResultCount", "onChangeTab", "currentTab", "setCurrentTab", "isInsertAdvertising", "isOpenSort", "setIsOpenSort", "currentSortKey", "setCurrentSortKey", "tab", "searchProductsResult", "searchBlogsResult", "searchPagesResult", "totalCount", "acc", "curr", "searchProductsResultWithAdvertising", "advertisingData", "defaultSortKey", "prev", "sortKey"]
7
7
  }
package/dist/cjs/biz-components/SearchPage/types.d.ts CHANGED
@@ -13,6 +13,7 @@ export interface SearchPageProps {
13
13
  [key in SearchPageTabType]: number;
14
14
  };
15
15
  loading?: boolean;
16
+ shopNowLoadingProductId?: string;
16
17
  searchValue: string;
17
18
  data: any;
18
19
  buildProps?: {
@@ -30,6 +31,7 @@ export interface SearchProductItemProps {
30
31
  searchValue?: string;
31
32
  product: any;
32
33
  variantData?: any;
34
+ shopNowLoadingProductId?: string;
33
35
  onSecondaryButton?: () => void;
34
36
  onPrimaryButton?: () => void;
35
37
  }
@@ -49,6 +51,7 @@ export declare enum SearchPageTabType {
49
51
  export interface SearchRecommendProductsProps {
50
52
  products: any[];
51
53
  title: string;
54
+ shopNowLoadingProductId?: string;
52
55
  buildProps?: {
53
56
  products: any[];
54
57
  };
package/dist/cjs/biz-components/SearchPage/types.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var n=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var u=(r,e)=>{for(var a in e)n(r,a,{get:e[a],enumerable:!0})},d=(r,e,a,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of c(e))!i.call(r,o)&&o!==a&&n(r,o,{get:()=>e[o],enumerable:!(t=s(e,o))||t.enumerable});return r};var y=r=>d(n({},"__esModule",{value:!0}),r);var P={};u(P,{IPC_SEARCH_PAGE:()=>g,SearchPageTabType:()=>p});module.exports=y(P);var p=(t=>(t.PRODUCTS="products",t.BLOGS="blogs",t.PAGES="pages",t))(p||{});const g="ipc-search-page";
1
+ "use strict";var n=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var d=(r,o)=>{for(var a in o)n(r,a,{get:o[a],enumerable:!0})},u=(r,o,a,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of c(o))!i.call(r,e)&&e!==a&&n(r,e,{get:()=>o[e],enumerable:!(t=s(o,e))||t.enumerable});return r};var g=r=>u(n({},"__esModule",{value:!0}),r);var P={};d(P,{IPC_SEARCH_PAGE:()=>y,SearchPageTabType:()=>p});module.exports=g(P);var p=(t=>(t.PRODUCTS="products",t.BLOGS="blogs",t.PAGES="pages",t))(p||{});const y="ipc-search-page";
2
2
  //# sourceMappingURL=types.js.map
package/dist/cjs/biz-components/SearchPage/types.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/SearchPage/types.ts"],
4
- "sourcesContent": ["import type { Product } from '../../cpn-components/CpnProductCard/types'\nimport type { Img } from '../../types/props'\n\nexport type SearchPageType = 'products' | 'blogs' | 'pages'\n\nexport type SortKey = {\n id: string\n value: string\n label: string\n}\n\nexport interface SearchPageProps {\n searchResult: {\n [key in SearchPageTabType]: any\n }\n searchResultCount: {\n [key in SearchPageTabType]: number\n }\n loading?: boolean\n searchValue: string\n data: any\n buildProps?: {\n products: any[]\n }\n onChangeTab?: (tabType: SearchPageTabType) => void\n onSecondaryButton?: (product: Product) => void\n onPrimaryButton?: (product: Product) => void\n // loadMore?: (type: SearchPageType) => void\n onChangeSort?: (tabType: SearchPageType, sortKey: { value: string; label: string }) => void\n}\n\nexport interface SearchProductItemProps {\n searchValue?: string\n product: any\n variantData?: any\n onSecondaryButton?: () => void\n onPrimaryButton?: () => void\n}\n\nexport interface SearchBlogItemProps {\n searchValue: string\n blog: any\n}\n\nexport interface SearchPageItemProps {\n searchValue: string\n page: any\n}\n\nexport enum SearchPageTabType {\n PRODUCTS = 'products',\n BLOGS = 'blogs',\n PAGES = 'pages',\n}\n\nexport interface SearchRecommendProductsProps {\n products: any[]\n title: string\n buildProps?: {\n products: any[]\n }\n onSecondaryButton?: () => void\n onPrimaryButton?: () => void\n}\n\nexport const IPC_SEARCH_PAGE = 'ipc-search-page'\n"],
5
- "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,qBAAAE,EAAA,sBAAAC,IAAA,eAAAC,EAAAJ,GAiDO,IAAKG,OACVA,EAAA,SAAW,WACXA,EAAA,MAAQ,QACRA,EAAA,MAAQ,QAHEA,OAAA,IAgBL,MAAMD,EAAkB",
4
+ "sourcesContent": ["import type { Product } from '../../cpn-components/CpnProductCard/types'\nimport type { Img } from '../../types/props'\n\nexport type SearchPageType = 'products' | 'blogs' | 'pages'\n\nexport type SortKey = {\n id: string\n value: string\n label: string\n}\n\nexport interface SearchPageProps {\n searchResult: {\n [key in SearchPageTabType]: any\n }\n searchResultCount: {\n [key in SearchPageTabType]: number\n }\n loading?: boolean\n shopNowLoadingProductId?: string\n searchValue: string\n data: any\n buildProps?: {\n products: any[]\n }\n onChangeTab?: (tabType: SearchPageTabType) => void\n onSecondaryButton?: (product: Product) => void\n onPrimaryButton?: (product: Product) => void\n // loadMore?: (type: SearchPageType) => void\n onChangeSort?: (tabType: SearchPageType, sortKey: { value: string; label: string }) => void\n}\n\nexport interface SearchProductItemProps {\n searchValue?: string\n product: any\n variantData?: any\n shopNowLoadingProductId?: string\n onSecondaryButton?: () => void\n onPrimaryButton?: () => void\n}\n\nexport interface SearchBlogItemProps {\n searchValue: string\n blog: any\n}\n\nexport interface SearchPageItemProps {\n searchValue: string\n page: any\n}\n\nexport enum SearchPageTabType {\n PRODUCTS = 'products',\n BLOGS = 'blogs',\n PAGES = 'pages',\n}\n\nexport interface SearchRecommendProductsProps {\n products: any[]\n title: string\n shopNowLoadingProductId?: string\n buildProps?: {\n products: any[]\n }\n onSecondaryButton?: () => void\n onPrimaryButton?: () => void\n}\n\nexport const IPC_SEARCH_PAGE = 'ipc-search-page'\n"],
5
+ "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,qBAAAE,EAAA,sBAAAC,IAAA,eAAAC,EAAAJ,GAmDO,IAAKG,OACVA,EAAA,SAAW,WACXA,EAAA,MAAQ,QACRA,EAAA,MAAQ,QAHEA,OAAA,IAiBL,MAAMD,EAAkB",
6
6
  "names": ["types_exports", "__export", "IPC_SEARCH_PAGE", "SearchPageTabType", "__toCommonJS"]
7
7
  }
package/dist/cjs/biz-components/Specs/dropdown.d.ts CHANGED
@@ -5,7 +5,6 @@ export type DropDownProps = {
5
5
  setActive: any;
6
6
  setVisible: any;
7
7
  visible: any;
8
- filterActive: any;
9
8
  };
10
- declare const DropDown: ({ index, active, list, setActive, setVisible, visible, filterActive }: DropDownProps) => import("react/jsx-runtime").JSX.Element;
9
+ declare const DropDown: ({ index, active, list, setActive, setVisible, visible }: DropDownProps) => import("react/jsx-runtime").JSX.Element;
11
10
  export default DropDown;
package/dist/cjs/biz-components/Specs/dropdown.js CHANGED
@@ -1,3 +1,3 @@
1
- "use strict";var p=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var D=(n,t)=>{for(var r in t)p(n,r,{get:t[r],enumerable:!0})},k=(n,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of v(t))!y.call(n,o)&&o!==r&&p(n,o,{get:()=>t[o],enumerable:!(s=x(t,o))||s.enumerable});return n};var m=n=>k(p({},"__esModule",{value:!0}),n);var C={};D(C,{default:()=>w});module.exports=m(C);var c=require("react/jsx-runtime"),l=require("react");const g="openDropDown",E=({index:n,active:t,list:r,setActive:s,setVisible:o,visible:u,filterActive:i})=>{const f=(0,l.useRef)(null);(0,l.useEffect)(()=>{const e=a=>{const d=a?.target?.getAttribute?.("class");!f?.current?.contains(a?.target)&&!d?.includes(g)&&o({...u,[n]:!1})};return document.addEventListener("click",e),()=>document.removeEventListener("click",e)},[]);const h=(0,l.useMemo)(()=>{const e=Object.keys(i||{});return r?.filter(a=>!e?.find(b=>i?.[b]?.handle===a?.handle))},[i,r]);return(0,c.jsx)("div",{ref:f,className:`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-[#F5F5F7] ${u?.[n]?"block":"hidden"}`,children:(0,c.jsx)("div",{className:"m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0",children:h?.map((e,a)=>{const d=e?.sku||e?.variants?.[0]?.sku;return(0,c.jsx)("div",{onClick:()=>{s({...t,[n]:{sku:d,name:e?.name||e?.title,handle:e?.handle}}),o({...u,[n]:!1})},title:e?.name||e?.title,className:`openDropDown min-xl:text-lg min-xxl:text-lg box-border cursor-pointer truncate px-6 py-4 text-base font-bold [&:hover]:bg-[#EAEAEC]
2
- ${e?.handle===t?.handle?"bg-[#EAEAEC]":""}`,children:e?.name||e?.title},a)})})})};var w=E;
1
+ "use strict";var i=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var x=Object.getOwnPropertyNames;var D=Object.prototype.hasOwnProperty;var k=(t,e)=>{for(var r in e)i(t,r,{get:e[r],enumerable:!0})},y=(t,e,r,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of x(e))!D.call(t,o)&&o!==r&&i(t,o,{get:()=>e[o],enumerable:!(s=h(e,o))||s.enumerable});return t};var m=t=>y(i({},"__esModule",{value:!0}),t);var w={};k(w,{default:()=>E});module.exports=m(w);var c=require("react/jsx-runtime"),a=require("react");const v="openDropDown",g=({index:t,active:e,list:r,setActive:s,setVisible:o,visible:u})=>{const p=(0,a.useRef)(null);(0,a.useEffect)(()=>{const n=l=>{const d=l?.target?.getAttribute?.("class");!p?.current?.contains(l?.target)&&!d?.includes(v)&&o({...u,[t]:!1})};return document.addEventListener("click",n),()=>document.removeEventListener("click",n)},[]);const b=(0,a.useMemo)(()=>{const n=Object.keys(e||{});return r?.filter(l=>!n?.find(f=>e?.[f]?.handle===l?.handle))},[e,r]);return(0,c.jsx)("div",{ref:p,className:`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-[#F5F5F7] ${u?.[t]?"block":"hidden"}`,children:(0,c.jsx)("div",{className:"m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0",children:b?.map((n,l)=>{const d=n?.sku||n?.variants?.[0]?.sku;return(0,c.jsx)("div",{onClick:()=>{s({...e,[t]:{sku:d,name:n?.name||n?.title,handle:n?.handle}}),o({...u,[t]:!1})},title:n?.name||n?.title,className:`openDropDown min-xl:text-lg min-xxl:text-lg box-border cursor-pointer truncate px-6 py-4 text-base font-bold [&:hover]:bg-[#EAEAEC]
2
+ ${n?.handle===e?.handle?"bg-[#EAEAEC]":""}`,children:n?.name||n?.title},l)})})})};var E=g;
3
3
  //# sourceMappingURL=dropdown.js.map
package/dist/cjs/biz-components/Specs/dropdown.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Specs/dropdown.tsx"],
4
- "sourcesContent": ["import { useEffect, useRef, useMemo } from 'react'\n\nconst clickContent = 'openDropDown'\n\nexport type DropDownProps = {\n index: number\n active: any\n list: any\n setActive: any\n setVisible: any\n visible: any\n filterActive: any\n}\n\nconst DropDown = ({ index, active, list, setActive, setVisible, visible, filterActive }: DropDownProps) => {\n const dropDownRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n const handleClickOutside = (event: any) => {\n const isDel = event?.target?.getAttribute?.('class')\n const isContainer = !dropDownRef?.current?.contains(event?.target)\n if (isContainer && !isDel?.includes(clickContent)) {\n setVisible({ ...visible, [index]: false })\n }\n }\n document.addEventListener('click', handleClickOutside)\n return () => document.removeEventListener('click', handleClickOutside)\n }, [])\n\n const handleList = useMemo(() => {\n const activeIndex = Object.keys(filterActive || {})\n return list?.filter((item: { handle: any }) => {\n const currentIndex = activeIndex?.find((items: string) => filterActive?.[items]?.handle === item?.handle)\n return !currentIndex\n })\n }, [filterActive, list])\n\n return (\n <div\n ref={dropDownRef}\n className={`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-[#F5F5F7] ${visible?.[index] ? 'block' : 'hidden'}`}\n >\n <div className={'m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0'}>\n {handleList?.map((item: any, id: number) => {\n const currentSku = item?.sku || item?.variants?.[0]?.sku\n return (\n <div\n key={id}\n onClick={() => {\n setActive({\n ...active,\n [index]: {\n sku: currentSku,\n name: item?.name || item?.title,\n handle: item?.handle,\n },\n })\n setVisible({ ...visible, [index]: false })\n }}\n title={item?.name || item?.title}\n className={`openDropDown min-xl:text-lg min-xxl:text-lg box-border cursor-pointer truncate px-6 py-4 text-base font-bold [&:hover]:bg-[#EAEAEC]\n ${item?.handle === active?.handle ? 'bg-[#EAEAEC]' : ''}`}\n >\n {item?.name || item?.title}\n </div>\n )\n })}\n </div>\n </div>\n )\n}\n\nexport default DropDown\n"],
5
- "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA8CY,IAAAI,EAAA,6BA9CZC,EAA2C,iBAE3C,MAAMC,EAAe,eAYfC,EAAW,CAAC,CAAE,MAAAC,EAAO,OAAAC,EAAQ,KAAAC,EAAM,UAAAC,EAAW,WAAAC,EAAY,QAAAC,EAAS,aAAAC,CAAa,IAAqB,CACzG,MAAMC,KAAc,UAAuB,IAAI,KAE/C,aAAU,IAAM,CACd,MAAMC,EAAsBC,GAAe,CACzC,MAAMC,EAAQD,GAAO,QAAQ,eAAe,OAAO,EAC/B,CAACF,GAAa,SAAS,SAASE,GAAO,MAAM,GAC9C,CAACC,GAAO,SAASZ,CAAY,GAC9CM,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAE7C,EACA,gBAAS,iBAAiB,QAASQ,CAAkB,EAC9C,IAAM,SAAS,oBAAoB,QAASA,CAAkB,CACvE,EAAG,CAAC,CAAC,EAEL,MAAMG,KAAa,WAAQ,IAAM,CAC/B,MAAMC,EAAc,OAAO,KAAKN,GAAgB,CAAC,CAAC,EAClD,OAAOJ,GAAM,OAAQW,GAEZ,CADcD,GAAa,KAAME,GAAkBR,IAAeQ,CAAK,GAAG,SAAWD,GAAM,MAAM,CAEzG,CACH,EAAG,CAACP,EAAcJ,CAAI,CAAC,EAEvB,SACE,OAAC,OACC,IAAKK,EACL,UAAW,yGAAyGF,IAAUL,CAAK,EAAI,QAAU,QAAQ,GAEzJ,mBAAC,OAAI,UAAW,6EACb,SAAAW,GAAY,IAAI,CAACE,EAAWE,IAAe,CAC1C,MAAMC,EAAaH,GAAM,KAAOA,GAAM,WAAW,CAAC,GAAG,IACrD,SACE,OAAC,OAEC,QAAS,IAAM,CACbV,EAAU,CACR,GAAGF,EACH,CAACD,CAAK,EAAG,CACP,IAAKgB,EACL,KAAMH,GAAM,MAAQA,GAAM,MAC1B,OAAQA,GAAM,MAChB,CACF,CAAC,EACDT,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAC3C,EACA,MAAOa,GAAM,MAAQA,GAAM,MAC3B,UAAW;AAAA,kBACPA,GAAM,SAAWZ,GAAQ,OAAS,eAAiB,EAAE,GAExD,SAAAY,GAAM,MAAQA,GAAM,OAhBhBE,CAiBP,CAEJ,CAAC,EACH,EACF,CAEJ,EAEA,IAAOrB,EAAQK",
6
- "names": ["dropdown_exports", "__export", "dropdown_default", "__toCommonJS", "import_jsx_runtime", "import_react", "clickContent", "DropDown", "index", "active", "list", "setActive", "setVisible", "visible", "filterActive", "dropDownRef", "handleClickOutside", "event", "isDel", "handleList", "activeIndex", "item", "items", "id", "currentSku"]
4
+ "sourcesContent": ["import { useEffect, useRef, useMemo } from 'react'\n\nconst clickContent = 'openDropDown'\n\nexport type DropDownProps = {\n index: number\n active: any\n list: any\n setActive: any\n setVisible: any\n visible: any\n}\n\nconst DropDown = ({ index, active, list, setActive, setVisible, visible }: DropDownProps) => {\n const dropDownRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n const handleClickOutside = (event: any) => {\n const isDel = event?.target?.getAttribute?.('class')\n const isContainer = !dropDownRef?.current?.contains(event?.target)\n if (isContainer && !isDel?.includes(clickContent)) {\n setVisible({ ...visible, [index]: false })\n }\n }\n document.addEventListener('click', handleClickOutside)\n return () => document.removeEventListener('click', handleClickOutside)\n }, [])\n\n const handleList = useMemo(() => {\n const activeIndex = Object.keys(active || {})\n return list?.filter((item: { handle: any }) => {\n const currentIndex = activeIndex?.find((items: string) => active?.[items]?.handle === item?.handle)\n return !currentIndex\n })\n }, [active, list])\n\n return (\n <div\n ref={dropDownRef}\n className={`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-[#F5F5F7] ${visible?.[index] ? 'block' : 'hidden'}`}\n >\n <div className={'m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0'}>\n {handleList?.map((item: any, id: number) => {\n const currentSku = item?.sku || item?.variants?.[0]?.sku\n return (\n <div\n key={id}\n onClick={() => {\n setActive({\n ...active,\n [index]: {\n sku: currentSku,\n name: item?.name || item?.title,\n handle: item?.handle,\n },\n })\n setVisible({ ...visible, [index]: false })\n }}\n title={item?.name || item?.title}\n className={`openDropDown min-xl:text-lg min-xxl:text-lg box-border cursor-pointer truncate px-6 py-4 text-base font-bold [&:hover]:bg-[#EAEAEC]\n ${item?.handle === active?.handle ? 'bg-[#EAEAEC]' : ''}`}\n >\n {item?.name || item?.title}\n </div>\n )\n })}\n </div>\n </div>\n )\n}\n\nexport default DropDown\n"],
5
+ "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6CY,IAAAI,EAAA,6BA7CZC,EAA2C,iBAE3C,MAAMC,EAAe,eAWfC,EAAW,CAAC,CAAE,MAAAC,EAAO,OAAAC,EAAQ,KAAAC,EAAM,UAAAC,EAAW,WAAAC,EAAY,QAAAC,CAAQ,IAAqB,CAC3F,MAAMC,KAAc,UAAuB,IAAI,KAE/C,aAAU,IAAM,CACd,MAAMC,EAAsBC,GAAe,CACzC,MAAMC,EAAQD,GAAO,QAAQ,eAAe,OAAO,EAC/B,CAACF,GAAa,SAAS,SAASE,GAAO,MAAM,GAC9C,CAACC,GAAO,SAASX,CAAY,GAC9CM,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAE7C,EACA,gBAAS,iBAAiB,QAASO,CAAkB,EAC9C,IAAM,SAAS,oBAAoB,QAASA,CAAkB,CACvE,EAAG,CAAC,CAAC,EAEL,MAAMG,KAAa,WAAQ,IAAM,CAC/B,MAAMC,EAAc,OAAO,KAAKV,GAAU,CAAC,CAAC,EAC5C,OAAOC,GAAM,OAAQU,GAEZ,CADcD,GAAa,KAAME,GAAkBZ,IAASY,CAAK,GAAG,SAAWD,GAAM,MAAM,CAEnG,CACH,EAAG,CAACX,EAAQC,CAAI,CAAC,EAEjB,SACE,OAAC,OACC,IAAKI,EACL,UAAW,yGAAyGD,IAAUL,CAAK,EAAI,QAAU,QAAQ,GAEzJ,mBAAC,OAAI,UAAW,6EACb,SAAAU,GAAY,IAAI,CAACE,EAAWE,IAAe,CAC1C,MAAMC,EAAaH,GAAM,KAAOA,GAAM,WAAW,CAAC,GAAG,IACrD,SACE,OAAC,OAEC,QAAS,IAAM,CACbT,EAAU,CACR,GAAGF,EACH,CAACD,CAAK,EAAG,CACP,IAAKe,EACL,KAAMH,GAAM,MAAQA,GAAM,MAC1B,OAAQA,GAAM,MAChB,CACF,CAAC,EACDR,EAAW,CAAE,GAAGC,EAAS,CAACL,CAAK,EAAG,EAAM,CAAC,CAC3C,EACA,MAAOY,GAAM,MAAQA,GAAM,MAC3B,UAAW;AAAA,kBACPA,GAAM,SAAWX,GAAQ,OAAS,eAAiB,EAAE,GAExD,SAAAW,GAAM,MAAQA,GAAM,OAhBhBE,CAiBP,CAEJ,CAAC,EACH,EACF,CAEJ,EAEA,IAAOpB,EAAQK",
6
+ "names": ["dropdown_exports", "__export", "dropdown_default", "__toCommonJS", "import_jsx_runtime", "import_react", "clickContent", "DropDown", "index", "active", "list", "setActive", "setVisible", "visible", "dropDownRef", "handleClickOutside", "event", "isDel", "handleList", "activeIndex", "item", "items", "id", "currentSku"]
7
7
  }