@anker-in/headless-ui 1.3.70 → 1.3.72

package/dist/cjs/biz-components/HeaderNavigation/index.js

@@ -1 +1 @@
-"use strict";"use client";var Me=Object.create;var Z=Object.defineProperty;var Se=Object.getOwnPropertyDescriptor;var Pe=Object.getOwnPropertyNames;var De=Object.getPrototypeOf,Ee=Object.prototype.hasOwnProperty;var Te=(n,r)=>{for(var i in r)Z(n,i,{get:r[i],enumerable:!0})},le=(n,r,i,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let u of Pe(r))!Ee.call(n,u)&&u!==i&&Z(n,u,{get:()=>r[u],enumerable:!(c=Se(r,u))||c.enumerable});return n};var ee=(n,r,i)=>(i=n!=null?Me(De(n)):{},le(r||!n||!n.__esModule?Z(i,"default",{value:n,enumerable:!0}):i,n)),He=n=>le(Z({},"__esModule",{value:!0}),n);var Ie={};Te(Ie,{default:()=>Re});module.exports=He(Ie);var e=require("react/jsx-runtime"),t=require("react"),l=require("../../components/index.js"),pe=require("../../shared/Styles.js"),k=require("../../helpers/utils.js"),F=ee(require("./NavProvider.js")),o=require("./types.js"),fe=ee(require("jump.js")),te=require("@gsap/react"),X=require("gsap"),C=require("./withCategory.js"),S=require("./icons/index.js"),be=ee(require("../NavigationSearch/index.js")),ve=require("./ResourceSidebarDropdown.js"),ge=require("./MobileResourceSidebarMenu.js"),he=require("./SidebarDropdown.js"),ae=require("./useScrollLock.js"),ye=require("./MulticolDropdown.js"),Ne=require("./SupportsDropdown.js"),ke=require("./MobileSidebarMenu.js"),we=require("./MobileSupportMenu.js"),xe=require("./MobileMulticolMenu.js"),ne=require("./MobileMenuComponents.js"),oe=require("../AiuiProvider/index.js"),ie=ee(require("../../shared/throttle.js"));const se=(0,t.forwardRef)((n,r)=>{const{data:{header:i}={},buildProps:c,event:u,profile:P,theme:s="light",isTop:m=!1,searchResult:x,onSearch:b,isSearching:p,keywords:_,onPrimaryNavClick:w,onSeriesProductClick:h,onSidebarNavClick:D,onMobileMenuToggle:U,headerId:E,cartCount:L,menuData:z,render:B,componentOverrides:G,...J}=n,[R,f]=(0,t.useState)(!1),[W,I]=(0,t.useState)(!1),[A,H]=(0,t.useState)(!1),[Y,g]=(0,t.useState)(!1),O=(0,t.useRef)(null),M=(0,t.useRef)(null),q=()=>{const y=document?.querySelector("body")?.offsetWidth||0;g(y<=1440)};(0,t.useEffect)(()=>(q(),window.addEventListener("resize",q),()=>{window.removeEventListener("resize",q)}),[]),(0,t.useImperativeHandle)(r,()=>M.current),(0,t.useEffect)(()=>{M.current&&m&&(0,fe.default)(M.current,{duration:0,offset:M.current?.getBoundingClientRect()?.bottom||0})},[m]),(0,t.useEffect)(()=>{if(m){I(!1),H(!1);return}let y=0,a=0,d=0;const v=()=>document?.documentElement?.scrollTop||document?.body?.scrollTop||0,N=v();y=N,I(N>300),H(N>30);const $=(0,ie.default)(()=>{const T=v(),K=T-y;H(T>30),K>0?(a=0,d+=K,d>=300&&T>300&&I(!0)):K<0&&(d=0,a+=Math.abs(K),a>=300&&(I(!1),a=0)),y=T},100);return window.addEventListener("scroll",$,{passive:!0}),()=>window.removeEventListener("scroll",$)},[m]),(0,t.useEffect)(()=>{u&&(u.search=()=>f(!0))},[u]),(0,te.useGSAP)(()=>{O?.current&&R&&X.gsap.fromTo(O.current,{height:0},{height:"auto",duration:.3})},[R]),(0,ae.useScrollLock)(R);const Q=(0,t.useMemo)(()=>i?.bar?.actions?.find(y=>y?.blockType===o.HeaderNavigationActionBlockType.Search)?.searchBar?.[0]||{},[i]),j=B?.mobileHeaderNavigation;return(0,e.jsx)(F.default,{buildProps:c,profile:P,isMobile:Y,event:u,payloadData:i,onSidebarNavClick:D,onSeriesProductClick:h,cartCount:L,componentOverrides:G,children:(0,e.jsx)("header",{...J,id:E||"header","data-ui-component-id":"HeaderNavigation",className:m?"relative z-[100] bg-white":(0,k.cn)("sticky top-0 z-[100] transition-transform duration-500 ease-in-out",{"translate-y-[-100%]":W}),ref:M,children:(0,e.jsxs)("div",{className:(0,k.cn)("hover:bg-white hover:text-black",s==="light"?"text-black":"text-white",{"!bg-white transition-all duration-500 ease-in-out":!m&&A},{"hover:!text-black":s==="dark","!text-black":!m&&A}),onClick:()=>!m&&H(!0),children:[(0,e.jsx)(ce,{data:i,className:"desktop:block hidden !bg-white",theme:s,onNavItemClick:()=>!m&&H(!0),onPrimaryNavClick:w}),j?(0,e.jsx)(j,{className:"desktop:hidden block !bg-white",menuData:z,data:i,onPrimaryNavClick:w}):(0,e.jsx)(ue,{menuData:z,data:i,className:"desktop:hidden block !bg-white",onPrimaryNavClick:w,onMobileMenuToggle:U}),R&&(0,e.jsxs)("div",{className:"absolute left-0 top-0 z-[60] flex w-full flex-col bg-black/70",style:{height:`calc(100dvh - ${M?.current?.getBoundingClientRect()?.top}px)`},role:"dialog","aria-modal":"true","aria-label":"Search",children:[(0,e.jsx)("div",{ref:O,className:(0,k.cn)("overflow-y-auto",{}),children:(0,e.jsx)(be.default,{data:Q,keywords:_,isSearching:p,searchResult:x,onSearch:y=>{b?.(y)},onClose:()=>{b?.(),f(!1)}})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>f(!1),role:"button",tabIndex:0,"aria-label":"Close search",onKeyDown:y=>{(y.key==="Enter"||y.key===" "||y.key==="Escape")&&(y.preventDefault(),f(!1))}})]})]})})})}),ce=(0,t.forwardRef)((n,r)=>{const{data:i,onNavItemClick:c,className:u,theme:P,onPrimaryNavClick:s}=n,{event:m,profile:x}=(0,F.useNavContext)(),[b,p]=(0,t.useState)(!1),{locale:_="us"}=(0,oe.useAiuiContext)(),w=(0,t.useMemo)(()=>(0,C.WithGroupCategory)(i?.categories?.filter(a=>a?.pcShow)),[i]),[h,D]=(0,t.useState)(null),[U,E]=(0,t.useState)([]),L=(0,t.useRef)(null),[z,B]=(0,t.useState)(!1),G=(0,t.useRef)(null),J=(0,t.useRef)(null),R=(0,t.useRef)(w.map(a=>Array(a?.length||0).fill(null)));(0,t.useEffect)(()=>{w?.length&&E(w?.map((a,d)=>a?.map((v,N)=>({groupIndex:d,index:N,open:!1}))))},[w]);const f=(0,t.useMemo)(()=>{let a=null;for(const d of U){for(const v of d)if(v.open){a=v;break}if(a)break}return a},[U]);(0,ae.useScrollLock)(!!f?.open||z);const W=(a,d,v)=>{B(!1);const N=w[d][v];if(N?.components?.[0]?.blockType===o.HeaderNavigationBlockType.Links)N?.components?.[0]?.url&&window.open(N?.components?.[0]?.url,N?.components?.[0]?.target??"_blank");else{const $=w?.flat()||[],T=$?.findIndex(K=>K?.id===w[d][v]?.id);a.stopPropagation(),c?.(),s?.($[T],T),D(N),E(K=>K.map(Ce=>Ce.map(V=>V.groupIndex===d&&V.index===v?{...V,open:!V.open}:{...V,open:!1})))}},I=(a,d,v)=>{a.key==="Enter"||a.key===" "?(a.preventDefault(),W(a,d,v)):a.key==="Escape"&&f?.groupIndex===d&&f?.index===v&&(a.preventDefault(),A())},A=()=>{E(a=>a.map(d=>d.map(v=>({...v,open:!1}))))},H=(0,t.useMemo)(()=>{if(h)return h?.components?.[0]?.blockType},[h]),Y=(0,C.WithSidebar)(he.SidebarDropdown,h),g=(0,C.WithResource)(ve.ResourceSidebarDropdown,h),O=(0,C.WithMulticol)(ye.MulticolDropdown,h),M=(0,C.WithSupports)(Ne.SupportsDropdown,{categoriesItem:h,currentNavItemRef:R.current?.[f?.groupIndex||0]?.[f?.index||0]}),q=(0,t.useMemo)(()=>{switch(H){case o.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(Y,{});case o.HeaderNavigationBlockType.Resource:return(0,e.jsx)(g,{});case o.HeaderNavigationBlockType.Supports:return(0,e.jsx)(M,{});case o.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(O,{});default:return null}},[H,h]),Q=(0,t.useMemo)(()=>i?.bar?.actions?.filter(a=>a?.pcShow),[i]),j=(0,t.useMemo)(()=>Q?.find(a=>a?.blockType===o.HeaderNavigationActionBlockType.Profile),[Q]),y=(0,t.useCallback)(()=>{B(a=>!a)},[]);return(0,t.useEffect)(()=>{if(L?.current){const a=L.current;return a.addEventListener("click",y),()=>{a.removeEventListener("click",y)}}},[y]),(0,te.useGSAP)(()=>{f?.open&&X.gsap.fromTo(J?.current,{height:0},{height:"auto"})},[f?.open]),(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[92px]",u),children:[(0,e.jsxs)("div",{ref:G,onClick:A,className:"flex h-full flex-col justify-end gap-4",children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsx)(de,{}),(0,e.jsx)(re,{ref:L,actions:Q,activeStatus:z})]}),(0,e.jsx)("nav",{className:"flex justify-between",role:"navigation","aria-label":"Primary navigation",children:w?.map((a,d)=>(0,e.jsx)("div",{className:"flex gap-3",children:a?.map((v,N)=>{const $=f?.groupIndex===d&&f?.index===N;return(0,e.jsx)("div",{ref:T=>{R.current[d][N]=T},className:"group",children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsxs)("button",{className:"flex cursor-pointer items-center gap-1 border-0 bg-transparent pb-4",onClick:T=>W(T,d,N),onKeyDown:T=>I(T,d,N),"aria-expanded":$,"aria-haspopup":"true","aria-label":v.text,children:[(0,e.jsx)(l.Text,{html:v.text,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)(S.DownArrow,{className:(0,k.cn)("size-4 opacity-0 transition-opacity duration-500 group-hover:opacity-100",{"rotate-180":f?.groupIndex===d&&f?.index===N,"opacity-100":b&&f?.groupIndex===d&&f?.index===N,invisible:!v?.components?.length||v?.components?.[0]?.blockType===o.HeaderNavigationBlockType.Links})})]}),(0,e.jsx)("div",{className:(0,k.cn)("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":$},P==="dark"?"bg-white":"bg-[#080A0F]"),"aria-hidden":"true"})]})},v.id)})},`groupCategory-${d}`))})]}),(0,e.jsxs)("div",{role:"menu","aria-hidden":!(f?.open&&h),className:(0,k.cn)("absolute left-0 top-full z-[999] flex w-full flex-col overflow-hidden border-t border-b-[#E4E5E6] bg-black/70 text-black",{hidden:!(f?.open&&h)}),onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),style:{height:`calc(100dvh - ${G?.current?.getBoundingClientRect()?.bottom}px)`},children:[(0,e.jsx)("div",{ref:J,className:(0,k.cn)("relative z-50",{"overflow-hidden":H!==o.HeaderNavigationBlockType.Supports}),children:q}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:A,role:"button",tabIndex:0,"aria-label":"Close menu",onKeyDown:a=>{(a.key==="Enter"||a.key===" "||a.key==="Escape")&&(a.preventDefault(),A())}})]}),z&&(0,e.jsxs)("div",{className:"absolute left-0 top-full z-[999] flex h-dvh w-full bg-black/70",role:"dialog","aria-modal":"true","aria-label":"User profile menu",children:[(0,e.jsx)("div",{className:"rounded-box absolute w-[272px] overflow-hidden bg-white p-4",style:{right:`calc(100% - ${L?.current?.getBoundingClientRect()?.right}px)`,top:"-36px"},children:x?.email?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:x?.nick_name||j?.welcome,className:"text-sm font-bold"}),(0,e.jsx)("div",{className:"mt-2 h-px bg-[#D9D9D9]","aria-hidden":"true"}),(0,e.jsx)("nav",{className:"mt-2",role:"navigation","aria-label":"Profile navigation",children:j?.profiles?.map(a=>(0,e.jsx)(ne.MenuItem,{className:"py-2",label:a?.title,href:(0,k.getLocalizedPath)(a?.url,_)},a.id))})]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(S.Polygon,{className:"absolute -top-2 right-[46px] z-30 text-white","aria-hidden":"true"}),(0,e.jsx)(l.Text,{html:j?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:j?.benefits?.map(a=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:a.benefitIcon?.url,className:"size-4 shrink-0",alt:a.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:a.benefit,className:"text-sm font-bold leading-[1.4]"})]},a.id))}),(0,e.jsxs)("div",{className:"mt-4 flex flex-wrap gap-2",children:[(0,e.jsx)(l.Button,{className:"grow",variant:"secondary",size:"lg",onClick:()=>m?.join?.(),children:(0,e.jsx)(l.Text,{html:j?.primaryButton||"Join Now",className:"font-bold"})}),(0,e.jsx)(l.Button,{className:"grow",variant:"primary",size:"lg",onClick:()=>m?.login?.(),children:(0,e.jsx)(l.Text,{html:j?.secondaryButton||"Log In",className:"font-bold"})})]})]})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>B(!1),role:"button",tabIndex:0,"aria-label":"Close profile menu",onKeyDown:a=>{(a.key==="Enter"||a.key===" "||a.key==="Escape")&&(a.preventDefault(),B(!1))}})]})]})}),ue=(0,t.forwardRef)(({data:n,menuData:r,className:i,onPrimaryNavClick:c,onMobileMenuToggle:u},P)=>{const s=(0,t.useMemo)(()=>(0,C.WithGroupCategory)(n?.categories?.filter(g=>g?.mobileShow)),[n]),{currentMenu:m,setCurrentMenu:x,subSubCategory:b}=(0,F.useNavContext)(),[p,_]=(0,t.useState)(!1),[w,h]=(0,t.useState)(0),[D,U]=(0,t.useState)(null),E=(0,t.useRef)(null),L=(0,t.useRef)(!1);(0,t.useEffect)(()=>{if(E?.current&&p){const g=E?.current?.getBoundingClientRect();h(window?.innerHeight-(g?.top||0))}u?.({open:p})},[p,u]),(0,t.useEffect)(()=>{if(!p)return;const g=(0,ie.default)(()=>{if(E?.current){const O=E.current.getBoundingClientRect();L.current=!0,h(window?.innerHeight-(O?.top||0))}},100);return window.addEventListener("resize",g),()=>window.removeEventListener("resize",g)},[p]),(0,te.useGSAP)(()=>{if(L.current){X.gsap.set(E.current,{height:w}),L.current=!1;return}X.gsap.fromTo(E.current,{height:0},{height:w,duration:.3})},[w]),(0,ae.useScrollLock)(p);const z=(0,t.useMemo)(()=>D?.components?.[0]?.blockType,[D]),B=(0,C.WithSupports)(we.MobileSupportMenu,{categoriesItem:D}),G=(0,C.WithSidebar)(ke.MobileSidebarMenu,D),J=(0,C.WithResource)(ge.MobileResourceSidebarMenu,D),R=(0,C.WithMulticol)(xe.MobileMulticolMenu,D),f=(0,t.useMemo)(()=>{switch(z){case o.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(G,{});case o.HeaderNavigationBlockType.Resource:return(0,e.jsx)(J,{});case o.HeaderNavigationBlockType.Supports:return(0,e.jsx)(B,{});case o.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(R,{});default:return null}},[z,D,B]),W=(0,t.useCallback)(()=>{_(!1),h(0),x&&x(o.HeaderNavigationMenu.Primary)},[_,h,x]),I=(0,t.useMemo)(()=>n?.bar?.actions?.filter(g=>g?.mobileShow&&g?.blockType!==o.HeaderNavigationActionBlockType.Profile),[n]),A=(0,t.useMemo)(()=>n?.bar?.actions?.find(g=>g?.mobileShow&&g?.blockType===o.HeaderNavigationActionBlockType.Profile)||{},[n]),H=(0,t.useMemo)(()=>{switch(m){case o.HeaderNavigationMenu.Primary:return(0,e.jsx)(Be,{actions:I,menuOpen:p,onMenuOpenClose:()=>{_(!1),h(0)},onMenuOpenClick:()=>_(!0)});case o.HeaderNavigationMenu.Secondary:return(0,e.jsx)(me,{title:D?.text,onMenuOpenClose:W,onMenuBackClick:()=>x?.(o.HeaderNavigationMenu.Primary)});case o.HeaderNavigationMenu.Third:return(0,e.jsx)(me,{title:b?.label,onMenuOpenClose:W,onMenuBackClick:()=>x?.(o.HeaderNavigationMenu.Secondary)});default:return null}},[p,m,x,D,I,b,W]),Y=(0,t.useCallback)((g,O)=>{const M=Array.isArray(s)?Array.isArray(s[g])?s[g][O]:{}:{};U(M),M?.components?.[0]?.blockType===o.HeaderNavigationBlockType.Links?M?.components?.[0]?.url&&window.open(M?.components?.[0]?.url,M?.components?.[0]?.target??"_blank"):x?.(o.HeaderNavigationMenu.Secondary)},[s,x]);return(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[56px]",i),children:[H,p&&(0,e.jsxs)("nav",{ref:E,className:"absolute left-0 top-full z-[999] w-full overflow-y-auto border-t border-[#E4E5E6] bg-white text-black",style:{height:w},role:"navigation","aria-label":"Mobile navigation menu",children:[m===o.HeaderNavigationMenu.Primary&&r?(0,e.jsx)("div",{className:"pt-4",children:(0,e.jsx)(l.BrandStrip,{data:r})}):null,m===o.HeaderNavigationMenu.Primary?(0,e.jsx)(Le,{categories:s,onPrimaryMenuClick:Y,onPrimaryNavClick:c,profileAction:A}):f]})]})}),Le=({categories:n,onPrimaryMenuClick:r,profileAction:i,onPrimaryNavClick:c})=>(0,e.jsxs)("div",{className:"flex h-full flex-col justify-between",children:[(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:n?.map((u,P)=>(0,e.jsxs)("div",{className:"",children:[(0,e.jsx)("div",{className:(0,k.cn)("my-2 h-px w-full bg-[#E5E5E7]")}),u?.map((s,m)=>(0,e.jsx)(ne.MenuItem,{label:s.text,onClick:()=>{const b=(n?.flat()||[])?.findIndex(p=>p?.id===n[P][m]?.id);r(P,m),c?.(s,b)},icon:s.components?.[0]?.icon},s.id))]},`groupCategory-${P}`))}),(0,e.jsx)(ze,{profileAction:i})]}),ze=({profileAction:n})=>{const[r,i]=(0,t.useState)(!1),{profile:c,event:u}=(0,F.useNavContext)(),{locale:P="us"}=(0,oe.useAiuiContext)();return(0,e.jsxs)("div",{className:(0,k.cn)("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":r}),children:[(0,e.jsxs)("button",{className:"flex w-full cursor-pointer items-center justify-between border-0 bg-transparent",onClick:()=>i(!r),"aria-expanded":r,"aria-label":c?.nick_name||n?.welcome,children:[(0,e.jsxs)("div",{className:"flex items-center gap-[14px]",children:[(0,e.jsx)("div",{className:"flex size-[40px] shrink-0 items-center justify-center rounded-full bg-white",children:(0,e.jsx)(S.User,{"aria-hidden":"true"})}),(0,e.jsx)(l.Text,{html:c?.nick_name||n?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!c?.email&&(0,e.jsx)(S.DownArrow,{"aria-hidden":"true",className:(0,k.cn)("laptop:size-4 size-5",{"rotate-180":r})})]}),c?.email&&(0,e.jsx)("nav",{className:"mt-4",role:"navigation","aria-label":"Profile menu",children:n?.profiles?.map(s=>(0,e.jsx)(ne.MenuItem,{label:s?.title,href:(0,k.getLocalizedPath)(s?.url,P)},s.id))}),r&&!c?.email&&(0,e.jsxs)("div",{className:"mt-4",children:[(0,e.jsx)(l.Text,{html:n?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:n?.benefits?.map(s=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:s.benefitIcon?.url,className:"size-4",alt:s.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:s.benefit,className:"text-sm font-bold leading-[1.4]"})]},s.id))})]}),!c?.email&&(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-3",children:[(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"secondary",size:"base",onClick:()=>u?.join?.(),children:(0,e.jsx)(l.Text,{html:n?.primaryButton||"Join Now",className:"text-sm font-bold leading-[1.4]"})}),(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"primary",size:"base",onClick:()=>u?.login?.(),children:(0,e.jsx)(l.Text,{html:n?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},Be=({menuOpen:n,onMenuOpenClose:r,onMenuOpenClick:i,actions:c})=>(0,e.jsxs)("div",{className:"flex h-full items-center justify-between gap-4",children:[(0,e.jsx)(de,{}),(0,e.jsxs)("div",{className:"desktop:gap-6 flex items-center gap-4",children:[(0,e.jsx)(re,{actions:c}),n?(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Close menu","aria-expanded":"true",children:(0,e.jsx)(S.Close,{className:"size-5","aria-hidden":"true"})}):(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>i(),"aria-label":"Open menu","aria-expanded":"false","aria-haspopup":"true",children:(0,e.jsx)(S.Menu,{className:"size-5","aria-hidden":"true"})})]})]}),de=()=>{const{payloadData:n,isMobile:r}=(0,F.useNavContext)(),{locale:i="us"}=(0,oe.useAiuiContext)();return(0,e.jsx)("a",{href:(0,k.getLocalizedPath)("/",i),className:"hover:text-[#00CBEB] [&>svg]:w-full","aria-label":"Home",dangerouslySetInnerHTML:{__html:r?n?.bar?.mobileLogo:n?.bar?.desktopLogo}})},re=(0,t.forwardRef)(({actions:n,activeStatus:r=!1},i)=>{const{event:c,cartCount:u}=(0,F.useNavContext)(),[P,s]=(0,t.useState)(null),m=b=>{switch(b){case o.HeaderNavigationActionBlockType.Search:return"Search";case o.HeaderNavigationActionBlockType.Cart:return`Shopping cart${u>0?` (${u} items)`:""}`;case o.HeaderNavigationActionBlockType.Profile:return"User profile";case o.HeaderNavigationActionBlockType.Livestream:return"Livestream";default:return"Action"}},x=(0,t.useCallback)((b,p)=>{switch(s(p),b?.blockType){case o.HeaderNavigationActionBlockType.Search:c?.search?.();break;case o.HeaderNavigationActionBlockType.Cart:c?.cart?.();break;case o.HeaderNavigationActionBlockType.Profile:c?.profile?.();break;case o.HeaderNavigationActionBlockType.Livestream:c?.livestream?.();break;default:return()=>{}}},[c]);return(0,e.jsx)("div",{className:"desktop:gap-6 flex items-center gap-4",children:Array.isArray(n)&&n?.map((b,p)=>(0,e.jsxs)("button",{className:"relative cursor-pointer border-0 bg-transparent p-0","data-tag":b?.tag||"",ref:b.blockType===o.HeaderNavigationActionBlockType.Profile?i:null,onClick:()=>x(b,p),"aria-label":m(b.blockType),"aria-pressed":r&&P===p,children:[(0,e.jsx)(l.Text,{html:b.icon,className:(0,k.cn)("size-5",{"text-brand-0":r&&P===p}),"aria-hidden":"true"}),b.blockType===o.HeaderNavigationActionBlockType.Cart&&u>0&&(0,e.jsx)("div",{className:"bg-brand-0 absolute right-[-12px] top-[calc(100%-16px)] z-[1] flex min-h-5 min-w-5 items-center justify-center rounded-full px-[2px]","aria-hidden":"true",children:(0,e.jsx)(l.Text,{html:u?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},b.id))})}),me=({title:n,onMenuOpenClose:r,onMenuBackClick:i})=>(0,e.jsxs)("div",{className:"flex h-full items-center gap-3",children:[(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>i(),"aria-label":"Back to previous menu",children:(0,e.jsx)(S.LeftArrow,{className:"size-5","aria-hidden":"true"})}),(0,e.jsx)(l.Text,{html:n,className:"flex-1 text-center text-base font-bold leading-[1.4]"}),(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Close menu",children:(0,e.jsx)(S.Close,{className:"size-5","aria-hidden":"true"})})]});ue.displayName="MobileNavigation",re.displayName="Actions",se.displayName="HeaderNavigation",ce.displayName="DesktopNavigation";var Re=(0,pe.withLayout)(se);
+"use strict";"use client";var Me=Object.create;var Z=Object.defineProperty;var Se=Object.getOwnPropertyDescriptor;var Pe=Object.getOwnPropertyNames;var De=Object.getPrototypeOf,Ee=Object.prototype.hasOwnProperty;var Te=(n,r)=>{for(var i in r)Z(n,i,{get:r[i],enumerable:!0})},le=(n,r,i,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let u of Pe(r))!Ee.call(n,u)&&u!==i&&Z(n,u,{get:()=>r[u],enumerable:!(c=Se(r,u))||c.enumerable});return n};var ee=(n,r,i)=>(i=n!=null?Me(De(n)):{},le(r||!n||!n.__esModule?Z(i,"default",{value:n,enumerable:!0}):i,n)),He=n=>le(Z({},"__esModule",{value:!0}),n);var Ie={};Te(Ie,{default:()=>Re});module.exports=He(Ie);var e=require("react/jsx-runtime"),t=require("react"),l=require("../../components/index.js"),pe=require("../../shared/Styles.js"),w=require("../../helpers/utils.js"),F=ee(require("./NavProvider.js")),o=require("./types.js"),fe=ee(require("jump.js")),te=require("@gsap/react"),X=require("gsap"),x=require("./withCategory.js"),S=require("./icons/index.js"),be=ee(require("../NavigationSearch/index.js")),ve=require("./ResourceSidebarDropdown.js"),ge=require("./MobileResourceSidebarMenu.js"),he=require("./SidebarDropdown.js"),ae=require("./useScrollLock.js"),ye=require("./MulticolDropdown.js"),Ne=require("./SupportsDropdown.js"),ke=require("./MobileSidebarMenu.js"),we=require("./MobileSupportMenu.js"),Ce=require("./MobileMulticolMenu.js"),ne=require("./MobileMenuComponents.js"),oe=require("../AiuiProvider/index.js"),ie=ee(require("../../shared/throttle.js"));const se=(0,t.forwardRef)((n,r)=>{const{data:{header:i}={},buildProps:c,event:u,profile:T,theme:s="light",isTop:d=!1,searchResult:h,onSearch:v,isSearching:p,keywords:L,onPrimaryNavClick:C,onSeriesProductClick:y,onSidebarNavClick:P,onMobileMenuToggle:U,headerId:D,cartCount:z,menuData:B,render:R,componentOverrides:G,...J}=n,[I,f]=(0,t.useState)(!1),[W,A]=(0,t.useState)(!1),[O,H]=(0,t.useState)(!1),[Y,g]=(0,t.useState)(!1),j=(0,t.useRef)(null),M=(0,t.useRef)(null),q=()=>{const N=document?.querySelector("body")?.offsetWidth||0;g(N<=1440)};(0,t.useEffect)(()=>(q(),window.addEventListener("resize",q),()=>{window.removeEventListener("resize",q)}),[]),(0,t.useImperativeHandle)(r,()=>M.current),(0,t.useEffect)(()=>{M.current&&d&&(0,fe.default)(M.current,{duration:0,offset:M.current?.getBoundingClientRect()?.bottom||0})},[d]),(0,t.useEffect)(()=>{if(d){A(!1),H(!1);return}let N=0,a=0,m=0;const b=()=>document?.documentElement?.scrollTop||document?.body?.scrollTop||0,k=b();N=k,A(k>300),H(k>30);const $=(0,ie.default)(()=>{const E=b(),K=E-N;H(E>30),K>0?(a=0,m+=K,m>=300&&E>300&&A(!0)):K<0&&(m=0,a+=Math.abs(K),a>=300&&(A(!1),a=0)),N=E},100);return window.addEventListener("scroll",$,{passive:!0}),()=>window.removeEventListener("scroll",$)},[d]),(0,t.useEffect)(()=>{u&&(u.search=()=>f(!0))},[u]),(0,te.useGSAP)(()=>{j?.current&&I&&X.gsap.fromTo(j.current,{height:0},{height:"auto",duration:.3})},[I]),(0,ae.useScrollLock)(I);const Q=(0,t.useMemo)(()=>i?.bar?.actions?.find(N=>N?.blockType===o.HeaderNavigationActionBlockType.Search)?.searchBar?.[0]||{},[i]),_=R?.mobileHeaderNavigation;return(0,e.jsx)(F.default,{buildProps:c,profile:T,isMobile:Y,event:u,payloadData:i,onSidebarNavClick:P,onSeriesProductClick:y,cartCount:z,componentOverrides:G,children:(0,e.jsx)("header",{...J,id:D||"header","data-ui-component-id":"HeaderNavigation",className:d?"relative z-[100] bg-white":(0,w.cn)("sticky top-0 z-[100] transition-transform duration-500 ease-in-out",{"translate-y-[-100%]":W}),ref:M,children:(0,e.jsxs)("div",{className:(0,w.cn)("hover:bg-white hover:text-black",s==="light"?"text-black":"text-white",{"!bg-white transition-all duration-500 ease-in-out":!d&&O},{"hover:!text-black":s==="dark","!text-black":!d&&O}),onClick:()=>!d&&H(!0),children:[(0,e.jsx)(ce,{data:i,className:"desktop:block hidden !bg-white",theme:s,onNavItemClick:()=>!d&&H(!0),onPrimaryNavClick:C}),_?(0,e.jsx)(_,{className:"desktop:hidden block !bg-white",menuData:B,data:i,onPrimaryNavClick:C}):(0,e.jsx)(ue,{menuData:B,data:i,className:"desktop:hidden block !bg-white",onPrimaryNavClick:C,onMobileMenuToggle:U}),I&&(0,e.jsxs)("div",{className:"absolute left-0 top-0 z-[60] flex w-full flex-col bg-black/70",style:{height:`calc(100dvh - ${M?.current?.getBoundingClientRect()?.top}px)`},role:"dialog","aria-modal":"true","aria-label":"Search",children:[(0,e.jsx)("div",{ref:j,className:(0,w.cn)("overflow-y-auto",{}),children:(0,e.jsx)(be.default,{data:Q,keywords:L,isSearching:p,searchResult:h,onSearch:N=>{v?.(N)},onClose:()=>{v?.(),f(!1)}})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>f(!1),role:"button",tabIndex:0,"aria-label":"Close search",onKeyDown:N=>{(N.key==="Enter"||N.key===" "||N.key==="Escape")&&(N.preventDefault(),f(!1))}})]})]})})})}),ce=(0,t.forwardRef)((n,r)=>{const{data:i,onNavItemClick:c,className:u,theme:T,onPrimaryNavClick:s}=n,{event:d,profile:h}=(0,F.useNavContext)(),[v,p]=(0,t.useState)(!1),{locale:L="us"}=(0,oe.useAiuiContext)(),C=(0,t.useMemo)(()=>(0,x.WithGroupCategory)(i?.categories?.filter(a=>a?.pcShow)),[i]),[y,P]=(0,t.useState)(null),[U,D]=(0,t.useState)([]),z=(0,t.useRef)(null),[B,R]=(0,t.useState)(!1),G=(0,t.useRef)(null),J=(0,t.useRef)(null),I=(0,t.useRef)(C.map(a=>Array(a?.length||0).fill(null)));(0,t.useEffect)(()=>{C?.length&&D(C?.map((a,m)=>a?.map((b,k)=>({groupIndex:m,index:k,open:!1}))))},[C]);const f=(0,t.useMemo)(()=>{let a=null;for(const m of U){for(const b of m)if(b.open){a=b;break}if(a)break}return a},[U]);(0,ae.useScrollLock)(!!f?.open||B);const W=(a,m,b)=>{R(!1);const k=C[m][b];if(k?.components?.[0]?.blockType===o.HeaderNavigationBlockType.Links)k?.components?.[0]?.url&&window.open(k?.components?.[0]?.url,k?.components?.[0]?.target??"_blank");else{const $=C?.flat()||[],E=$?.findIndex(K=>K?.id===C[m][b]?.id);a.stopPropagation(),c?.(),s?.($[E],E),P(k),D(K=>K.map(xe=>xe.map(V=>V.groupIndex===m&&V.index===b?{...V,open:!V.open}:{...V,open:!1})))}},A=(a,m,b)=>{a.key==="Enter"||a.key===" "?(a.preventDefault(),W(a,m,b)):a.key==="Escape"&&f?.groupIndex===m&&f?.index===b&&(a.preventDefault(),O())},O=()=>{D(a=>a.map(m=>m.map(b=>({...b,open:!1}))))},H=(0,t.useMemo)(()=>{if(y)return y?.components?.[0]?.blockType},[y]),Y=(0,x.WithSidebar)(he.SidebarDropdown,y),g=(0,x.WithResource)(ve.ResourceSidebarDropdown,y),j=(0,x.WithMulticol)(ye.MulticolDropdown,y),M=(0,x.WithSupports)(Ne.SupportsDropdown,{categoriesItem:y,currentNavItemRef:I.current?.[f?.groupIndex||0]?.[f?.index||0]}),q=(0,t.useMemo)(()=>{switch(H){case o.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(Y,{});case o.HeaderNavigationBlockType.Resource:return(0,e.jsx)(g,{});case o.HeaderNavigationBlockType.Supports:return(0,e.jsx)(M,{});case o.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(j,{});default:return null}},[H,y]),Q=(0,t.useMemo)(()=>i?.bar?.actions?.filter(a=>a?.pcShow),[i]),_=(0,t.useMemo)(()=>Q?.find(a=>a?.blockType===o.HeaderNavigationActionBlockType.Profile),[Q]),N=(0,t.useCallback)(()=>{R(a=>!a)},[]);return(0,t.useEffect)(()=>{if(z?.current){const a=z.current;return a.addEventListener("click",N),()=>{a.removeEventListener("click",N)}}},[N]),(0,te.useGSAP)(()=>{f?.open&&X.gsap.fromTo(J?.current,{height:0},{height:"auto"})},[f?.open]),(0,e.jsxs)(l.Container,{className:(0,w.cn)("relative h-[92px]",u),children:[(0,e.jsxs)("div",{ref:G,onClick:O,className:"flex h-full flex-col justify-end gap-4",children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsx)(de,{}),(0,e.jsx)(re,{ref:z,actions:Q,activeStatus:B})]}),(0,e.jsx)("nav",{className:"flex justify-between",role:"navigation","aria-label":"Primary navigation",children:C?.map((a,m)=>(0,e.jsx)("div",{className:"flex gap-3",children:a?.map((b,k)=>{const $=f?.groupIndex===m&&f?.index===k;return(0,e.jsx)("div",{ref:E=>{I.current[m][k]=E},className:"group",children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsxs)("button",{className:"flex cursor-pointer items-center gap-1 border-0 bg-transparent pb-4",onClick:E=>W(E,m,k),onKeyDown:E=>A(E,m,k),"aria-expanded":$,"aria-haspopup":"true","aria-label":b.text,children:[(0,e.jsx)(l.Text,{html:b.text,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)(S.DownArrow,{className:(0,w.cn)("size-4 opacity-0 transition-opacity duration-500 group-hover:opacity-100",{"rotate-180":f?.groupIndex===m&&f?.index===k,"opacity-100":v&&f?.groupIndex===m&&f?.index===k,invisible:!b?.components?.length||b?.components?.[0]?.blockType===o.HeaderNavigationBlockType.Links})})]}),(0,e.jsx)("div",{className:(0,w.cn)("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":$},T==="dark"?"bg-white":"bg-[#080A0F]"),"aria-hidden":"true"})]})},b.id)})},`groupCategory-${m}`))})]}),(0,e.jsxs)("div",{role:"menu","aria-hidden":!(f?.open&&y),className:(0,w.cn)("absolute left-0 top-full z-[999] flex w-full flex-col overflow-hidden border-t border-b-[#E4E5E6] bg-black/70 text-black",{hidden:!(f?.open&&y)}),onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),style:{height:`calc(100dvh - ${G?.current?.getBoundingClientRect()?.bottom}px)`},children:[(0,e.jsx)("div",{ref:J,className:(0,w.cn)("relative z-50",{"overflow-hidden":H!==o.HeaderNavigationBlockType.Supports}),children:q}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:O,role:"button",tabIndex:0,"aria-label":"Close menu",onKeyDown:a=>{(a.key==="Enter"||a.key===" "||a.key==="Escape")&&(a.preventDefault(),O())}})]}),B&&(0,e.jsxs)("div",{className:"absolute left-0 top-full z-[999] flex h-dvh w-full bg-black/70",role:"dialog","aria-modal":"true","aria-label":"User profile menu",children:[(0,e.jsx)("div",{className:"rounded-box absolute w-[272px] overflow-hidden bg-white p-4",style:{right:`calc(100% - ${z?.current?.getBoundingClientRect()?.right}px)`,top:"-36px"},children:h?.email?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:h?.nick_name||_?.welcome,className:"text-sm font-bold"}),(0,e.jsx)("div",{className:"mt-2 h-px bg-[#D9D9D9]","aria-hidden":"true"}),(0,e.jsx)("nav",{className:"mt-2",role:"navigation","aria-label":"Profile navigation",children:_?.profiles?.map(a=>(0,e.jsx)(ne.MenuItem,{className:"py-2",label:a?.title,href:(0,w.getLocalizedPath)(a?.url,L)},a.id))})]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(S.Polygon,{className:"absolute -top-2 right-[46px] z-30 text-white","aria-hidden":"true"}),(0,e.jsx)(l.Text,{html:_?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:_?.benefits?.map(a=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:a.benefitIcon?.url,className:"size-4 shrink-0",alt:a.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:a.benefit,className:"text-sm font-bold leading-[1.4]"})]},a.id))}),(0,e.jsxs)("div",{className:"mt-4 flex flex-wrap gap-2",children:[(0,e.jsx)(l.Button,{className:"grow",variant:"secondary",size:"lg",onClick:()=>d?.join?.(),children:(0,e.jsx)(l.Text,{html:_?.primaryButton||"Join Now",className:"font-bold"})}),(0,e.jsx)(l.Button,{className:"grow",variant:"primary",size:"lg",onClick:()=>d?.login?.(),children:(0,e.jsx)(l.Text,{html:_?.secondaryButton||"Log In",className:"font-bold"})})]})]})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>R(!1),role:"button",tabIndex:0,"aria-label":"Close profile menu",onKeyDown:a=>{(a.key==="Enter"||a.key===" "||a.key==="Escape")&&(a.preventDefault(),R(!1))}})]})]})}),ue=(0,t.forwardRef)(({data:n,menuData:r,className:i,onPrimaryNavClick:c,onMobileMenuToggle:u},T)=>{const s=(0,t.useMemo)(()=>(0,x.WithGroupCategory)(n?.categories?.filter(g=>g?.mobileShow)),[n]),{currentMenu:d,setCurrentMenu:h,subSubCategory:v}=(0,F.useNavContext)(),[p,L]=(0,t.useState)(!1),[C,y]=(0,t.useState)(0),[P,U]=(0,t.useState)(null),D=(0,t.useRef)(null),z=(0,t.useRef)(!1);(0,t.useEffect)(()=>{if(D?.current&&p){const g=D?.current?.getBoundingClientRect();y(window?.innerHeight-(g?.top||0))}u?.({open:p})},[p,u]),(0,t.useEffect)(()=>{if(!p)return;const g=(0,ie.default)(()=>{if(D?.current){const j=D.current.getBoundingClientRect();z.current=!0,y(window?.innerHeight-(j?.top||0))}},100);return window.addEventListener("resize",g),()=>window.removeEventListener("resize",g)},[p]),(0,te.useGSAP)(()=>{if(z.current){X.gsap.set(D.current,{height:C}),z.current=!1;return}X.gsap.fromTo(D.current,{height:0},{height:C,duration:.3})},[C]),(0,ae.useScrollLock)(p);const B=(0,t.useMemo)(()=>P?.components?.[0]?.blockType,[P]),R=(0,x.WithSupports)(we.MobileSupportMenu,{categoriesItem:P}),G=(0,x.WithSidebar)(ke.MobileSidebarMenu,P),J=(0,x.WithResource)(ge.MobileResourceSidebarMenu,P),I=(0,x.WithMulticol)(Ce.MobileMulticolMenu,P),f=(0,t.useMemo)(()=>{switch(B){case o.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(G,{});case o.HeaderNavigationBlockType.Resource:return(0,e.jsx)(J,{});case o.HeaderNavigationBlockType.Supports:return(0,e.jsx)(R,{});case o.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(I,{});default:return null}},[B,P,R]),W=(0,t.useCallback)(()=>{L(!1),y(0),h&&h(o.HeaderNavigationMenu.Primary)},[L,y,h]),A=(0,t.useMemo)(()=>n?.bar?.actions?.filter(g=>g?.mobileShow&&g?.blockType!==o.HeaderNavigationActionBlockType.Profile),[n]),O=(0,t.useMemo)(()=>n?.bar?.actions?.find(g=>g?.mobileShow&&g?.blockType===o.HeaderNavigationActionBlockType.Profile)||{},[n]),H=(0,t.useMemo)(()=>{switch(d){case o.HeaderNavigationMenu.Primary:return(0,e.jsx)(Be,{actions:A,menuOpen:p,onMenuOpenClose:()=>{L(!1),y(0)},onMenuOpenClick:()=>L(!0)});case o.HeaderNavigationMenu.Secondary:return(0,e.jsx)(me,{title:P?.text,onMenuOpenClose:W,onMenuBackClick:()=>h?.(o.HeaderNavigationMenu.Primary)});case o.HeaderNavigationMenu.Third:return(0,e.jsx)(me,{title:v?.label,onMenuOpenClose:W,onMenuBackClick:()=>h?.(o.HeaderNavigationMenu.Secondary)});default:return null}},[p,d,h,P,A,v,W]),Y=(0,t.useCallback)((g,j)=>{const M=Array.isArray(s)?Array.isArray(s[g])?s[g][j]:{}:{};U(M),M?.components?.[0]?.blockType===o.HeaderNavigationBlockType.Links?M?.components?.[0]?.url&&window.open(M?.components?.[0]?.url,M?.components?.[0]?.target??"_blank"):h?.(o.HeaderNavigationMenu.Secondary)},[s,h]);return(0,e.jsxs)(l.Container,{className:(0,w.cn)("relative h-[56px]",i),children:[H,p&&(0,e.jsxs)("nav",{ref:D,className:"absolute left-0 top-full z-[999] w-full overflow-y-auto border-t border-[#E4E5E6] bg-white text-black",style:{height:C},role:"navigation","aria-label":"Mobile navigation menu",children:[d===o.HeaderNavigationMenu.Primary&&r?(0,e.jsx)("div",{className:"pt-4",children:(0,e.jsx)(l.BrandStrip,{data:r})}):null,d===o.HeaderNavigationMenu.Primary?(0,e.jsx)(Le,{categories:s,onPrimaryMenuClick:Y,onPrimaryNavClick:c,profileAction:O,menuData:r}):f]})]})}),Le=({categories:n,onPrimaryMenuClick:r,profileAction:i,onPrimaryNavClick:c,menuData:u})=>(0,e.jsxs)("div",{className:"flex h-full flex-col justify-between",children:[(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:n?.map((T,s)=>(0,e.jsxs)("div",{className:"",children:[s>0||u?(0,e.jsx)("div",{className:(0,w.cn)("my-2 h-px w-full bg-[#E5E5E7]")}):null,T?.map((d,h)=>(0,e.jsx)(ne.MenuItem,{label:d.text,onClick:()=>{const p=(n?.flat()||[])?.findIndex(L=>L?.id===n[s][h]?.id);r(s,h),c?.(d,p)},icon:d.components?.[0]?.icon},d.id))]},`groupCategory-${s}`))}),(0,e.jsx)(ze,{profileAction:i})]}),ze=({profileAction:n})=>{const[r,i]=(0,t.useState)(!1),{profile:c,event:u}=(0,F.useNavContext)(),{locale:T="us"}=(0,oe.useAiuiContext)();return(0,e.jsxs)("div",{className:(0,w.cn)("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":r}),children:[(0,e.jsxs)("button",{className:"flex w-full cursor-pointer items-center justify-between border-0 bg-transparent",onClick:()=>i(!r),"aria-expanded":r,"aria-label":c?.nick_name||n?.welcome,children:[(0,e.jsxs)("div",{className:"flex items-center gap-[14px]",children:[(0,e.jsx)("div",{className:"flex size-[40px] shrink-0 items-center justify-center rounded-full bg-white",children:(0,e.jsx)(S.User,{"aria-hidden":"true"})}),(0,e.jsx)(l.Text,{html:c?.nick_name||n?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!c?.email&&(0,e.jsx)(S.DownArrow,{"aria-hidden":"true",className:(0,w.cn)("laptop:size-4 size-5",{"rotate-180":r})})]}),c?.email&&(0,e.jsx)("nav",{className:"mt-4",role:"navigation","aria-label":"Profile menu",children:n?.profiles?.map(s=>(0,e.jsx)(ne.MenuItem,{label:s?.title,href:(0,w.getLocalizedPath)(s?.url,T)},s.id))}),r&&!c?.email&&(0,e.jsxs)("div",{className:"mt-4",children:[(0,e.jsx)(l.Text,{html:n?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:n?.benefits?.map(s=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:s.benefitIcon?.url,className:"size-4",alt:s.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:s.benefit,className:"text-sm font-bold leading-[1.4]"})]},s.id))})]}),!c?.email&&(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-3",children:[(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"secondary",size:"base",onClick:()=>u?.join?.(),children:(0,e.jsx)(l.Text,{html:n?.primaryButton||"Join Now",className:"text-sm font-bold leading-[1.4]"})}),(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"primary",size:"base",onClick:()=>u?.login?.(),children:(0,e.jsx)(l.Text,{html:n?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},Be=({menuOpen:n,onMenuOpenClose:r,onMenuOpenClick:i,actions:c})=>(0,e.jsxs)("div",{className:"flex h-full items-center justify-between gap-4",children:[(0,e.jsx)(de,{}),(0,e.jsxs)("div",{className:"desktop:gap-6 flex items-center gap-4",children:[(0,e.jsx)(re,{actions:c}),n?(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Close menu","aria-expanded":"true",children:(0,e.jsx)(S.Close,{className:"size-5","aria-hidden":"true"})}):(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>i(),"aria-label":"Open menu","aria-expanded":"false","aria-haspopup":"true",children:(0,e.jsx)(S.Menu,{className:"size-5","aria-hidden":"true"})})]})]}),de=()=>{const{payloadData:n,isMobile:r}=(0,F.useNavContext)(),{locale:i="us"}=(0,oe.useAiuiContext)();return(0,e.jsx)("a",{href:(0,w.getLocalizedPath)("/",i),className:"hover:text-[#00CBEB] [&>svg]:w-full","aria-label":"Home",dangerouslySetInnerHTML:{__html:r?n?.bar?.mobileLogo:n?.bar?.desktopLogo}})},re=(0,t.forwardRef)(({actions:n,activeStatus:r=!1},i)=>{const{event:c,cartCount:u}=(0,F.useNavContext)(),[T,s]=(0,t.useState)(null),d=v=>{switch(v){case o.HeaderNavigationActionBlockType.Search:return"Search";case o.HeaderNavigationActionBlockType.Cart:return`Shopping cart${u>0?` (${u} items)`:""}`;case o.HeaderNavigationActionBlockType.Profile:return"User profile";case o.HeaderNavigationActionBlockType.Livestream:return"Livestream";default:return"Action"}},h=(0,t.useCallback)((v,p)=>{switch(s(p),v?.blockType){case o.HeaderNavigationActionBlockType.Search:c?.search?.();break;case o.HeaderNavigationActionBlockType.Cart:c?.cart?.();break;case o.HeaderNavigationActionBlockType.Profile:c?.profile?.();break;case o.HeaderNavigationActionBlockType.Livestream:c?.livestream?.();break;default:return()=>{}}},[c]);return(0,e.jsx)("div",{className:"desktop:gap-6 flex items-center gap-4",children:Array.isArray(n)&&n?.map((v,p)=>(0,e.jsxs)("button",{className:"relative cursor-pointer border-0 bg-transparent p-0","data-tag":v?.tag||"",ref:v.blockType===o.HeaderNavigationActionBlockType.Profile?i:null,onClick:()=>h(v,p),"aria-label":d(v.blockType),"aria-pressed":r&&T===p,children:[(0,e.jsx)(l.Text,{html:v.icon,className:(0,w.cn)("size-5",{"text-brand-0":r&&T===p}),"aria-hidden":"true"}),v.blockType===o.HeaderNavigationActionBlockType.Cart&&u>0&&(0,e.jsx)("div",{className:"bg-brand-0 absolute right-[-12px] top-[calc(100%-16px)] z-[1] flex min-h-5 min-w-5 items-center justify-center rounded-full px-[2px]","aria-hidden":"true",children:(0,e.jsx)(l.Text,{html:u?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},v.id))})}),me=({title:n,onMenuOpenClose:r,onMenuBackClick:i})=>(0,e.jsxs)("div",{className:"flex h-full items-center gap-3",children:[(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>i(),"aria-label":"Back to previous menu",children:(0,e.jsx)(S.LeftArrow,{className:"size-5","aria-hidden":"true"})}),(0,e.jsx)(l.Text,{html:n,className:"flex-1 text-center text-base font-bold leading-[1.4]"}),(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Close menu",children:(0,e.jsx)(S.Close,{className:"size-5","aria-hidden":"true"})})]});ue.displayName="MobileNavigation",re.displayName="Actions",se.displayName="HeaderNavigation",ce.displayName="DesktopNavigation";var Re=(0,pe.withLayout)(se);

package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js

@@ -1 +1 @@
-"use strict";var ie=Object.create;var H=Object.defineProperty;var oe=Object.getOwnPropertyDescriptor;var re=Object.getOwnPropertyNames;var ne=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var ce=(e,l)=>{for(var i in l)H(e,i,{get:l[i],enumerable:!0})},O=(e,l,i,w)=>{if(l&&typeof l=="object"||typeof l=="function")for(let s of re(l))!se.call(e,s)&&s!==i&&H(e,s,{get:()=>l[s],enumerable:!(w=oe(l,s))||w.enumerable});return e};var de=(e,l,i)=>(i=e!=null?ie(ne(e)):{},O(l||!e||!e.__esModule?H(i,"default",{value:e,enumerable:!0}):i,e)),ue=e=>O(H({},"__esModule",{value:!0}),e);var fe={};ce(fe,{default:()=>ge});module.exports=ue(fe);var t=require("react/jsx-runtime"),W=require("../../../../AiuiProvider/index.js"),_=require("../../../../../components/index.js"),a=require("react"),T=require("swiper/react"),b=require("swiper/modules"),C=require("../../../../../helpers/index.js"),A=require("./types.js"),I=require("@radix-ui/react-tabs"),j=require("../../../BizProductProvider.js"),J=require("../../../hooks/use-variant-media.js"),Q=require("./components/SpecsModal.js"),X=de(require("./components/CompareModal.js")),ee=require("../../../utils/index.js"),te=require("../../../../../shared/Styles.js"),ae=require("../../../../../shared/track.js"),le=require("../../../../../components/index.js"),Y=require("es-toolkit");const q=e=>(0,t.jsxs)("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:[(0,t.jsx)("rect",{x:"48",y:"48",width:"48",height:"48",rx:"24",transform:"rotate(-180 48 48)",fill:"white"}),(0,t.jsx)("path",{d:"M25.1035 16.8545C25.5372 16.3818 26.246 16.3818 26.6797 16.8545C27.1067 17.3201 27.1067 18.0706 26.6797 18.5361L21.668 24L26.6797 29.4639C27.1067 29.9294 27.1067 30.6799 26.6797 31.1455C26.246 31.6182 25.5372 31.6182 25.1035 31.1455L19.3203 24.8408C18.8933 24.3752 18.8933 23.6248 19.3203 23.1592L25.1035 16.8545Z",fill:"currentColor"})]}),U=e=>(0,t.jsxs)("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:[(0,t.jsx)("rect",{width:"48",height:"48",rx:"24",transform:"matrix(1 -8.74228e-08 -8.74228e-08 -1 0 48)",fill:"white"}),(0,t.jsx)("path",{d:"M22.8965 16.8545C22.4628 16.3818 21.754 16.3818 21.3203 16.8545C20.8933 17.3201 20.8933 18.0706 21.3203 18.5361L26.332 24L21.3203 29.4639C20.8933 29.9294 20.8933 30.6799 21.3203 31.1455C21.754 31.6182 22.4628 31.6182 22.8965 31.1455L28.6797 24.8408C29.1067 24.3752 29.1067 23.6248 28.6797 23.1592L22.8965 16.8545Z",fill:"currentColor"})]}),pe=()=>{const{copyWriting:e}=(0,W.useAiuiContext)(),{product:l,variant:i,selectedOptions:w}=(0,j.useBizProductContext)(),s=(0,J.useVariantMedia)({product:l,variant:i}),[y,N]=(0,a.useState)(null),V=(0,a.useRef)(null),f=i?.metafields?.component?.custom_media_list;let u,S,E,L;f&&f?.available?(u=f?.product||[],S=f?.scenarios||[],E=f?.keyFeatures||[],L=f?.video||[]):(u=s?.productList,S=s?.sceneList,E=s?.keyFeaturesList,L=s?.videoList);const p=(0,a.useMemo)(()=>[...u,...S,...L],[u,S,L]),g={productList:u,sceneList:S,keyFeaturesList:E,videoList:L},o=(0,a.useMemo)(()=>{const n=l?.payload?.components?.find(v=>v.componentKey==="ProductGallery")?.data||[],d=i?.payload?.components?.find(v=>v.componentKey==="ProductGallery")?.data||[];return n?.map(v=>{const k=Array.isArray(d)?d?.find(F=>v?.galleries===F?.galleries):{};let D=g[v?.galleries]||[];if(k?.images&&Array.isArray(k.images)&&k.images.length>0){const F=k.images.map(m=>{const M=[];if(m.image_1920&&m.image_1920.trim()&&M.push(`${m.image_1920}`),m.image_1440&&m.image_1440.trim()&&M.push(`${m.image_1440} 1919`),m.image_1024&&m.image_1024.trim()&&M.push(`${m.image_1024} 1439`),m.image_768&&m.image_768.trim()&&M.push(`${m.image_768} 1023`),m.image_390&&m.image_390.trim()&&M.push(`${m.image_390} 767`),M.length>0){const K=M.join(", ");return{image:{url:K,altText:v.comment?.content||""},_fromImages:!0,_responsiveSource:K}}return null}).filter(m=>m!==null);F.length>0&&(D=F)}return{...v,galleries:D}}).filter(v=>v.galleries.length>0)},[i?.payload,g,l?.payload]),[x,r]=(0,a.useState)(o?.[0]),[c,P]=(0,a.useState)(0),[h,G]=(0,a.useState)(null),R=(0,a.useCallback)(()=>{const n=(c+1)%o.length;P(n),r(o[n]),G(0)},[c,o]),z=(0,a.useCallback)(()=>{const n=c===0?o.length-1:c-1;P(n),r(o[n]);const d=o[n]?.galleries||[];G(d.length-1)},[c,o]);(0,a.useEffect)(()=>{c!=null&&requestAnimationFrame(()=>{V.current?.scrollToTab(c)})},[c]),(0,a.useEffect)(()=>{r(o[0]),P(0)},[i?.id]);const B=(n,d)=>{switch(n?.galleryTabType){case A.GalleryTabType.GALLERY_IMAGE_MAIN:return(0,t.jsx)($,{...n,index:d,onNextTab:R,onPrevTab:z,targetSlideIndex:h,onSlideChange:()=>G(null)});case A.GalleryTabType.GALLERY_IMAGE_FEATURES:return(0,t.jsx)($,{...n,index:d,onNextTab:R,onPrevTab:z,targetSlideIndex:h,onSlideChange:()=>G(null)});case A.GalleryTabType.GALLERY_IMAGE_SCENE:return(0,t.jsx)($,{...n,index:d,onNextTab:R,onPrevTab:z,targetSlideIndex:h,onSlideChange:()=>G(null)});case A.GalleryTabType.GALLERY_VIDEO:return(0,t.jsx)(be,{...n,onNextTab:R,onPrevTab:z,targetSlideIndex:h,onSlideChange:()=>G(null)});default:return null}};return(0,t.jsx)("div",{id:"ipc-product-gallery",children:(0,t.jsxs)(I.Root,{className:"relative",value:x?.tabValue,defaultValue:o?.[0]?.tabValue,children:[(0,t.jsx)("div",{className:"tablet:h-[620px] laptop-md:rounded-2xl laptop-md:h-[560px] lg-desktop:h-[700px] laptop-md:relative h-[420px] overflow-hidden bg-[#EAEAEC] ",children:o.map((n,d)=>(0,t.jsx)(I.Content,{className:"h-full",value:n.tabValue,children:B(n,d)},n.tabValue))}),(0,t.jsx)(Z,{ref:V,galleryTabs:o,activeGalleryTab:x,setActiveGalleryTab:r,setActiveTabIndex:P,setTargetSlideIndex:G})]})})},Z=(0,a.forwardRef)((e,l)=>{const{galleryTabs:i,activeGalleryTab:w,setActiveGalleryTab:s,setActiveTabIndex:y,setTargetSlideIndex:N}=e,{product:V}=(0,j.useBizProductContext)(),f=(0,a.useRef)(null),u=(0,a.useRef)(new Map),S=(0,a.useCallback)(p=>{if(f.current){const g=f.current,o=p.currentTarget,x=o.offsetLeft-g.offsetWidth/2+o.offsetWidth/2;g.scrollTo({left:x,behavior:"smooth"})}},[]),E=(0,a.useCallback)((p,g,o)=>{s(g),y(o),N(0),S(p)},[s,y,N,S]),L=(0,a.useCallback)(p=>{if(f.current&&i[p]){const g=f.current,o=i[p],x=u.current.get(o.tabValue);if(x){const r=x.offsetLeft-g.offsetWidth/2+x.offsetWidth/2;g.scrollTo({left:r,behavior:"smooth"})}}},[i]);return(0,a.useImperativeHandle)(l,()=>({scrollToTab:L})),(0,t.jsxs)("div",{className:"laptop:inset-x-16 tablet:mt-3 laptop-md:static absolute inset-x-4 bottom-4 z-[2] flex items-center justify-between",children:[(0,t.jsx)(I.List,{ref:f,className:"laptop:p-0 laptop-md:p-1 overflow-x-auto rounded-full bg-[#EAEAEC] p-1",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:(0,t.jsx)("div",{className:"whitespace-nowrap",children:i?.map((p,g)=>(0,t.jsx)(I.Trigger,{ref:o=>{o?u.current.set(p.tabValue,o):u.current.delete(p.tabValue)},className:(0,C.cn)("lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] rounded-full px-5 pb-[10px] pt-[11px] text-[14px] font-bold leading-tight",p.tabValue===w?.tabValue&&"bg-white"),onClick:o=>E(o,p,g),value:p.tabValue,children:p.tabLabel},p.tabValue+g))})}),(0,t.jsx)("div",{className:"desktop:gap-2 desktop:flex hidden",children:V.metafields?.global?.specifications&&(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(Q.SpecsModal,{})," | ",(0,t.jsx)(X.default,{})]})})]})});Z.displayName="ProductGalleryTab";const $=(0,a.forwardRef)((e,l)=>{const{locale:i="us",copyWriting:w}=(0,W.useAiuiContext)(),{variant:s,totalSavings:y}=(0,j.useBizProductContext)(),N=(0,a.useRef)(null),[V,f]=(0,a.useState)(null),[u,S]=(0,a.useState)(null),[E,L]=(0,a.useState)([]),p=(0,a.useRef)(null),g=(0,a.useMemo)(()=>{if(e?.galleryTabType===A.GalleryTabType.GALLERY_IMAGE_MAIN)return"size-[240px] mx-auto mt-[42px] tablet:mt-16 tablet:size-[420px] lg-desktop:size-[560px]";e?.galleryTabType===A.GalleryTabType.GALLERY_IMAGE_FEATURES||(e?.galleryTabType,A.GalleryTabType.GALLERY_IMAGE_SCENE)},[e?.galleryTabType]),o=(0,a.useCallback)(()=>{u?.isBeginning?e.onPrevTab?.():u?.slidePrev()},[u,e]),x=(0,a.useCallback)(()=>{u?.isEnd?e.onNextTab?.():u?.slideNext()},[u,e]);return(0,a.useEffect)(()=>{u&&e.targetSlideIndex&&(u.slideTo(e.targetSlideIndex,0),e.onSlideChange?.())},[u,e.targetSlideIndex,e]),(0,a.useEffect)(()=>{const r=()=>{if(!e?.comment?.content||!p.current)return;const h=p.current;h.textContent="Test";const R=h.offsetHeight*2+2,B=e.comment.content.replace(/<[^>]*>/g," ").replace(/\s+/g," ").trim().split(" "),n=[];let d="";for(let v=0;v<B.length;v++){const k=B[v],D=d?`${d} ${k}`:k;h.textContent=D,h.offsetHeight>R?d?(n.push(d),d=k):(n.push(k),d=""):d=D}d&&n.push(d),h.textContent="",L(n)},c=requestAnimationFrame(()=>{requestAnimationFrame(()=>{r()})}),P=()=>{r()};return window.addEventListener("resize",(0,Y.debounce)(P,500)),()=>{cancelAnimationFrame(c),window.removeEventListener("resize",(0,Y.debounce)(P,500))}},[e?.comment?.content]),(0,t.jsxs)("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[(0,t.jsx)(T.Swiper,{ref:l,className:"h-full",onSwiper:S,onTouchEnd:(r,c)=>{r.isBeginning&&r.swipeDirection==="prev"?o():r.isEnd&&r.swipeDirection==="next"&&x()},pagination:{clickable:!0,el:N.current},thumbs:{swiper:V},modules:[b.Mousewheel,b.Thumbs,b.Navigation,b.Pagination],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:e?.galleries?.map((r,c)=>{const P=`${e.tabValue}-${c}`,h=()=>{(0,ae.gaTrack)({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${s.sku}`,component_type:"image",component_name:e?.tabLabel||"",position:c+1,creative_id:"",component_title:"",component_description:"",navigation:""}})},G=r?._responsiveSource||r?.image?.url||"";return(0,t.jsx)(T.SwiperSlide,{className:"h-full",children:(0,t.jsx)(le.ExposureDetector,{onExposure:h,exposureKey:P,threshold:.5,duration:2e3,className:"h-full",children:(0,t.jsx)(_.Picture,{source:G,alt:r?.image?.altText,className:(0,C.cn)("h-full",g),imgClassName:"object-cover h-full"})})},e?.id+"SwiperSlideItem"+c)})}),s.availableForSale&&!!y&&!e.index&&(0,t.jsx)(_.Badge,{size:"lg",className:"bg-brand-0 laptop:left-16 laptop:top-5 laptop-md:left-6 laptop-md:top-6 absolute left-4 top-3 z-[2] text-white",children:`${(0,ee.formatPrice)({amount:y,currencyCode:s?.price?.currencyCode,locale:i})} ${w?.off}`}),(0,t.jsx)("div",{className:(0,C.cn)("tablet:opacity-0 tablet:block tablet:absolute tablet:top-1/2 laptop:left-16 tablet:left-6 laptop-md:left-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:o,children:(0,t.jsx)(q,{className:(0,C.cn)("tablet:size-10 lg-desktop:size-12")})}),(0,t.jsx)("div",{className:(0,C.cn)("tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 laptop:right-16 tablet:right-6 laptop-md:right-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:x,children:(0,t.jsx)(U,{className:(0,C.cn)("tablet:size-10 lg-desktop:size-12")})}),(0,t.jsxs)("div",{className:"tablet:bottom-[70px] tablet:flex laptop:inset-x-16 laptop-md:bottom-[20px] laptop-md:inset-x-6 absolute inset-x-4 bottom-[94px] z-10 items-center justify-between",children:[(0,t.jsx)("div",{className:"tablet:block hidden",children:(0,t.jsx)(T.Swiper,{className:"flex items-center justify-between",onSwiper:f,spaceBetween:12,slidesPerView:6,freeMode:!0,watchSlidesProgress:!0,modules:[b.Navigation,b.Thumbs],children:e?.galleries?.map((r,c)=>(0,t.jsx)(T.SwiperSlide,{className:"[&.swiper-slide-thumb-active]:border-brand !w-auto cursor-pointer border border-transparent [&.swiper-slide-thumb-active]:rounded",children:(0,t.jsx)(_.Picture,{source:r.image?.url,alt:r.image?.altText,className:"lg-desktop:size-12 size-10 overflow-hidden rounded bg-white",imgClassName:"object-cover h-full"})},e?.id+"SwiperSlideThumbItem"+c))})}),!e?.index&&(0,t.jsxs)("div",{className:"flex items-center gap-2",children:[(0,t.jsx)(_.Picture,{source:e?.comment?.avatar?.url,className:"laptop:size-10 size-8 shrink-0 rounded-full",imgClassName:"object-cover "}),(0,t.jsxs)("div",{className:"relative max-w-[528px]",children:[(0,t.jsx)("div",{ref:p,className:"lg-desktop:text-base pointer-events-none text-sm font-bold text-[#1D1D1F] opacity-0",style:{visibility:"hidden"}}),(0,t.jsx)(T.Swiper,{modules:[b.Autoplay],loop:E.length>1,className:"h-[44px]",direction:"vertical",autoplay:{delay:5e3,disableOnInteraction:!1},children:E.length>0?E.map((r,c)=>(0,t.jsx)(T.SwiperSlide,{children:(0,t.jsx)(_.Text,{html:r,as:"div",className:"lg-desktop:text-base overflow-hidden text-sm font-bold text-[#1D1D1F]"})},c+"text-group")):(0,t.jsx)(T.SwiperSlide,{children:(0,t.jsx)(_.Text,{as:"div",html:e?.comment?.content,className:"lg-desktop:text-base text-sm font-bold text-[#1D1D1F]"})})})]})]})]}),(0,t.jsx)("div",{ref:N,className:"tablet:hidden absolute inset-x-4 !bottom-[70px] z-10 text-center [&_.swiper-pagination-bullet-active]:!bg-[#080A0F] [&_.swiper-pagination-bullet]:bg-white [&_.swiper-pagination-bullet]:opacity-100"})]})});$.displayName="ProductGalleryTabImage";const me=({src:e})=>{const l=(0,a.useRef)(null);return(0,a.useEffect)(()=>{const i=l.current;i&&(i.muted=!0,i.play().catch(()=>{}))},[]),(0,t.jsxs)("video",{ref:l,playsInline:!0,autoPlay:!0,loop:!0,muted:!0,controls:!0,className:"w-full mt-20 laptop:size-full laptop:mt-0 aspect-video laptop:aspect-auto object-cover",children:[(0,t.jsx)("track",{kind:"captions"}),(0,t.jsx)("source",{src:e,type:"video/mp4"}),(0,t.jsx)("source",{src:e,type:"video/webm"}),(0,t.jsx)("source",{src:e,type:"video/ogg"})]})},be=e=>{const[l,i]=(0,a.useState)(null),w=(0,a.useCallback)(()=>{l?.isBeginning?e.onPrevTab?.():l?.slidePrev()},[l,e]),s=(0,a.useCallback)(()=>{l?.isEnd?e.onNextTab?.():l?.slideNext()},[l,e]);return(0,a.useEffect)(()=>{l&&e.targetSlideIndex!==null&&e.targetSlideIndex!==void 0&&(l.slideTo(e.targetSlideIndex,0),e.onSlideChange?.())},[l,e.targetSlideIndex,e]),(0,t.jsxs)("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[(0,t.jsx)(T.Swiper,{className:"h-full",onSwiper:i,onTouchEnd:(y,N)=>{y.isBeginning&&y.swipeDirection==="prev"?w():y.isEnd&&y.swipeDirection==="next"&&s()},modules:[b.Mousewheel,b.Thumbs,b.Navigation,b.Pagination],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:e?.galleries?.map((y,N)=>(0,t.jsx)(T.SwiperSlide,{className:"h-full bg-info-primary",children:(0,t.jsx)(me,{src:y?.sources?.[0]?.url})},e?.id+"SwiperSlideItem"+N))}),(0,t.jsx)("div",{className:(0,C.cn)("swiper-button tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:left-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:w,children:(0,t.jsx)(q,{className:"tablet:size-10 lg-desktop:size-12"})}),(0,t.jsx)("div",{className:(0,C.cn)("tablet:block swiper-button tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:right-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:s,children:(0,t.jsx)(U,{className:"tablet:size-10 lg-desktop:size-12"})})]})},ye=e=>(0,t.jsx)("div",{children:"3D View"});var ge=(0,te.withLayout)(pe);
+"use strict";var ie=Object.create;var H=Object.defineProperty;var oe=Object.getOwnPropertyDescriptor;var re=Object.getOwnPropertyNames;var ne=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var ce=(e,l)=>{for(var r in l)H(e,r,{get:l[r],enumerable:!0})},O=(e,l,r,S)=>{if(l&&typeof l=="object"||typeof l=="function")for(let c of re(l))!se.call(e,c)&&c!==r&&H(e,c,{get:()=>l[c],enumerable:!(S=oe(l,c))||S.enumerable});return e};var de=(e,l,r)=>(r=e!=null?ie(ne(e)):{},O(l||!e||!e.__esModule?H(r,"default",{value:e,enumerable:!0}):r,e)),ue=e=>O(H({},"__esModule",{value:!0}),e);var fe={};ce(fe,{default:()=>ge});module.exports=ue(fe);var t=require("react/jsx-runtime"),W=require("../../../../AiuiProvider/index.js"),k=require("../../../../../components/index.js"),a=require("react"),w=require("swiper/react"),b=require("swiper/modules"),P=require("../../../../../helpers/index.js"),C=require("./types.js"),_=require("@radix-ui/react-tabs"),j=require("../../../BizProductProvider.js"),J=require("../../../hooks/use-variant-media.js"),Q=require("./components/SpecsModal.js"),X=de(require("./components/CompareModal.js")),ee=require("../../../utils/index.js"),te=require("../../../../../shared/Styles.js"),ae=require("../../../../../shared/track.js"),le=require("../../../../../components/index.js"),Y=require("es-toolkit");const q=e=>(0,t.jsxs)("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:[(0,t.jsx)("rect",{x:"48",y:"48",width:"48",height:"48",rx:"24",transform:"rotate(-180 48 48)",fill:"white"}),(0,t.jsx)("path",{d:"M25.1035 16.8545C25.5372 16.3818 26.246 16.3818 26.6797 16.8545C27.1067 17.3201 27.1067 18.0706 26.6797 18.5361L21.668 24L26.6797 29.4639C27.1067 29.9294 27.1067 30.6799 26.6797 31.1455C26.246 31.6182 25.5372 31.6182 25.1035 31.1455L19.3203 24.8408C18.8933 24.3752 18.8933 23.6248 19.3203 23.1592L25.1035 16.8545Z",fill:"currentColor"})]}),U=e=>(0,t.jsxs)("svg",{width:"48",height:"48",viewBox:"0 0 48 48",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:[(0,t.jsx)("rect",{width:"48",height:"48",rx:"24",transform:"matrix(1 -8.74228e-08 -8.74228e-08 -1 0 48)",fill:"white"}),(0,t.jsx)("path",{d:"M22.8965 16.8545C22.4628 16.3818 21.754 16.3818 21.3203 16.8545C20.8933 17.3201 20.8933 18.0706 21.3203 18.5361L26.332 24L21.3203 29.4639C20.8933 29.9294 20.8933 30.6799 21.3203 31.1455C21.754 31.6182 22.4628 31.6182 22.8965 31.1455L28.6797 24.8408C29.1067 24.3752 29.1067 23.6248 28.6797 23.1592L22.8965 16.8545Z",fill:"currentColor"})]}),pe=()=>{const{copyWriting:e}=(0,W.useAiuiContext)(),{product:l,variant:r,selectedOptions:S}=(0,j.useBizProductContext)(),c=(0,J.useVariantMedia)({product:l,variant:r}),[y,E]=(0,a.useState)(null),M=(0,a.useRef)(null),G=r?.metafields?.component?.custom_media_list;let s,h,x,T;G&&G?.available?(s=G?.product||[],h=G?.scenarios||[],x=G?.keyFeatures||[],T=G?.video||[]):(s=c?.productList,h=c?.sceneList,x=c?.keyFeaturesList,T=c?.videoList);const A=(0,a.useMemo)(()=>[...s,...h,...T],[s,h,T]),V={productList:s,sceneList:h,keyFeaturesList:x,videoList:T},p=(0,a.useMemo)(()=>{const n=l?.payload?.components?.find(v=>v.componentKey==="ProductGallery")?.data||[],u=r?.payload?.components?.find(v=>v.componentKey==="ProductGallery")?.data||[];return n?.map(v=>{const L=Array.isArray(u)?u?.find(F=>v?.galleries===F?.galleries):{};let D=V[v?.galleries]||[];if(L?.images&&Array.isArray(L.images)&&L.images.length>0){const F=L.images.map(m=>{const I=[];if(m.image_1920&&m.image_1920.trim()&&I.push(`${m.image_1920}`),m.image_1440&&m.image_1440.trim()&&I.push(`${m.image_1440} 1919`),m.image_1024&&m.image_1024.trim()&&I.push(`${m.image_1024} 1439`),m.image_768&&m.image_768.trim()&&I.push(`${m.image_768} 1023`),m.image_390&&m.image_390.trim()&&I.push(`${m.image_390} 767`),I.length>0){const K=I.join(", ");return{image:{url:K,altText:v.comment?.content||""},_fromImages:!0,_responsiveSource:K}}return null}).filter(m=>m!==null);F.length>0&&(D=F)}return{...v,galleries:D}}).filter(v=>v.galleries.length>0)},[r?.payload,V,l?.payload]),[d,i]=(0,a.useState)(p?.[0]),[o,g]=(0,a.useState)(0),[f,N]=(0,a.useState)(null),R=(0,a.useCallback)(()=>{const n=(o+1)%p.length;g(n),i(p[n]),N(0)},[o,p]),z=(0,a.useCallback)(()=>{const n=o===0?p.length-1:o-1;g(n),i(p[n]);const u=p[n]?.galleries||[];N(u.length-1)},[o,p]);(0,a.useEffect)(()=>{o!=null&&requestAnimationFrame(()=>{M.current?.scrollToTab(o)})},[o]),(0,a.useEffect)(()=>{i(p[0]),g(0)},[r?.id]);const B=(n,u)=>{switch(n?.galleryTabType){case C.GalleryTabType.GALLERY_IMAGE_MAIN:return(0,t.jsx)($,{...n,index:u,onNextTab:R,onPrevTab:z,targetSlideIndex:f,onSlideChange:()=>N(null)});case C.GalleryTabType.GALLERY_IMAGE_FEATURES:return(0,t.jsx)($,{...n,index:u,onNextTab:R,onPrevTab:z,targetSlideIndex:f,onSlideChange:()=>N(null)});case C.GalleryTabType.GALLERY_IMAGE_SCENE:return(0,t.jsx)($,{...n,index:u,onNextTab:R,onPrevTab:z,targetSlideIndex:f,onSlideChange:()=>N(null)});case C.GalleryTabType.GALLERY_VIDEO:return(0,t.jsx)(be,{...n,onNextTab:R,onPrevTab:z,targetSlideIndex:f,onSlideChange:()=>N(null)});default:return null}};return(0,t.jsx)("div",{id:"ipc-product-gallery",children:(0,t.jsxs)(_.Root,{className:"relative",value:d?.tabValue,defaultValue:p?.[0]?.tabValue,children:[(0,t.jsx)("div",{className:"tablet:h-[620px] laptop-md:rounded-2xl laptop-md:h-[560px] lg-desktop:h-[700px] laptop-md:relative h-[420px] overflow-hidden bg-[#EAEAEC] ",children:p.map((n,u)=>(0,t.jsx)(_.Content,{className:"h-full",value:n.tabValue,children:B(n,u)},n.tabValue))}),(0,t.jsx)(Z,{ref:M,galleryTabs:p,activeGalleryTab:d,setActiveGalleryTab:i,setActiveTabIndex:g,setTargetSlideIndex:N})]})})},Z=(0,a.forwardRef)((e,l)=>{const{galleryTabs:r,activeGalleryTab:S,setActiveGalleryTab:c,setActiveTabIndex:y,setTargetSlideIndex:E}=e,{product:M,compareData:G}=(0,j.useBizProductContext)(),s=(0,a.useRef)(null),h=(0,a.useRef)(new Map),x=!!M.metafields?.global?.specifications?.length,T=!!G?.specificationKeys?.length,A=(0,a.useCallback)(d=>{if(s.current){const i=s.current,o=d.currentTarget,g=o.offsetLeft-i.offsetWidth/2+o.offsetWidth/2;i.scrollTo({left:g,behavior:"smooth"})}},[]),V=(0,a.useCallback)((d,i,o)=>{c(i),y(o),E(0),A(d)},[c,y,E,A]),p=(0,a.useCallback)(d=>{if(s.current&&r[d]){const i=s.current,o=r[d],g=h.current.get(o.tabValue);if(g){const f=g.offsetLeft-i.offsetWidth/2+g.offsetWidth/2;i.scrollTo({left:f,behavior:"smooth"})}}},[r]);return(0,a.useImperativeHandle)(l,()=>({scrollToTab:p})),(0,t.jsxs)("div",{className:"laptop:inset-x-16 tablet:mt-3 laptop-md:static absolute inset-x-4 bottom-4 z-[2] flex items-center justify-between",children:[(0,t.jsx)(_.List,{ref:s,className:"laptop:p-0 laptop-md:p-1 overflow-x-auto rounded-full bg-[#EAEAEC] p-1",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:(0,t.jsx)("div",{className:"whitespace-nowrap",children:r?.map((d,i)=>(0,t.jsx)(_.Trigger,{ref:o=>{o?h.current.set(d.tabValue,o):h.current.delete(d.tabValue)},className:(0,P.cn)("lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] rounded-full px-5 pb-[10px] pt-[11px] text-[14px] font-bold leading-tight",d.tabValue===S?.tabValue&&"bg-white"),onClick:o=>V(o,d,i),value:d.tabValue,children:d.tabLabel},d.tabValue+i))})}),(x||T)&&(0,t.jsxs)("div",{className:"desktop:gap-2 desktop:flex hidden",children:[x&&(0,t.jsx)(Q.SpecsModal,{}),x&&T&&(0,t.jsx)("span",{children:"|"}),T&&(0,t.jsx)(X.default,{})]})]})});Z.displayName="ProductGalleryTab";const $=(0,a.forwardRef)((e,l)=>{const{locale:r="us",copyWriting:S}=(0,W.useAiuiContext)(),{variant:c,totalSavings:y}=(0,j.useBizProductContext)(),E=(0,a.useRef)(null),[M,G]=(0,a.useState)(null),[s,h]=(0,a.useState)(null),[x,T]=(0,a.useState)([]),A=(0,a.useRef)(null),V=(0,a.useMemo)(()=>{if(e?.galleryTabType===C.GalleryTabType.GALLERY_IMAGE_MAIN)return"size-[240px] mx-auto mt-[42px] tablet:mt-16 tablet:size-[420px] lg-desktop:size-[560px]";e?.galleryTabType===C.GalleryTabType.GALLERY_IMAGE_FEATURES||(e?.galleryTabType,C.GalleryTabType.GALLERY_IMAGE_SCENE)},[e?.galleryTabType]),p=(0,a.useCallback)(()=>{s?.isBeginning?e.onPrevTab?.():s?.slidePrev()},[s,e]),d=(0,a.useCallback)(()=>{s?.isEnd?e.onNextTab?.():s?.slideNext()},[s,e]);return(0,a.useEffect)(()=>{s&&e.targetSlideIndex&&(s.slideTo(e.targetSlideIndex,0),e.onSlideChange?.())},[s,e.targetSlideIndex,e]),(0,a.useEffect)(()=>{const i=()=>{if(!e?.comment?.content||!A.current)return;const f=A.current;f.textContent="Test";const R=f.offsetHeight*2+2,B=e.comment.content.replace(/<[^>]*>/g," ").replace(/\s+/g," ").trim().split(" "),n=[];let u="";for(let v=0;v<B.length;v++){const L=B[v],D=u?`${u} ${L}`:L;f.textContent=D,f.offsetHeight>R?u?(n.push(u),u=L):(n.push(L),u=""):u=D}u&&n.push(u),f.textContent="",T(n)},o=requestAnimationFrame(()=>{requestAnimationFrame(()=>{i()})}),g=()=>{i()};return window.addEventListener("resize",(0,Y.debounce)(g,500)),()=>{cancelAnimationFrame(o),window.removeEventListener("resize",(0,Y.debounce)(g,500))}},[e?.comment?.content]),(0,t.jsxs)("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[(0,t.jsx)(w.Swiper,{ref:l,className:"h-full",onSwiper:h,onTouchEnd:(i,o)=>{i.isBeginning&&i.swipeDirection==="prev"?p():i.isEnd&&i.swipeDirection==="next"&&d()},pagination:{clickable:!0,el:E.current},thumbs:{swiper:M},modules:[b.Mousewheel,b.Thumbs,b.Navigation,b.Pagination],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:e?.galleries?.map((i,o)=>{const g=`${e.tabValue}-${o}`,f=()=>{(0,ae.gaTrack)({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:`Product Detail Page${c.sku}`,component_type:"image",component_name:e?.tabLabel||"",position:o+1,creative_id:"",component_title:"",component_description:"",navigation:""}})},N=i?._responsiveSource||i?.image?.url||"";return(0,t.jsx)(w.SwiperSlide,{className:"h-full",children:(0,t.jsx)(le.ExposureDetector,{onExposure:f,exposureKey:g,threshold:.5,duration:2e3,className:"h-full",children:(0,t.jsx)(k.Picture,{source:N,alt:i?.image?.altText,className:(0,P.cn)("h-full",V),imgClassName:"object-cover h-full"})})},e?.id+"SwiperSlideItem"+o)})}),c.availableForSale&&!!y&&!e.index&&(0,t.jsx)(k.Badge,{size:"lg",className:"bg-brand-0 laptop:left-16 laptop:top-5 laptop-md:left-6 laptop-md:top-6 absolute left-4 top-3 z-[2] text-white",children:`${(0,ee.formatPrice)({amount:y,currencyCode:c?.price?.currencyCode,locale:r})} ${S?.off}`}),(0,t.jsx)("div",{className:(0,P.cn)("tablet:opacity-0 tablet:block tablet:absolute tablet:top-1/2 laptop:left-16 tablet:left-6 laptop-md:left-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:p,children:(0,t.jsx)(q,{className:(0,P.cn)("tablet:size-10 lg-desktop:size-12")})}),(0,t.jsx)("div",{className:(0,P.cn)("tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 laptop:right-16 tablet:right-6 laptop-md:right-6 z-10 hidden -translate-y-1/2 cursor-pointer","swiper-button"),onClick:d,children:(0,t.jsx)(U,{className:(0,P.cn)("tablet:size-10 lg-desktop:size-12")})}),(0,t.jsxs)("div",{className:"tablet:bottom-[70px] tablet:flex laptop:inset-x-16 laptop-md:bottom-[20px] laptop-md:inset-x-6 absolute inset-x-4 bottom-[94px] z-10 items-center justify-between",children:[(0,t.jsx)("div",{className:"tablet:block hidden",children:(0,t.jsx)(w.Swiper,{className:"flex items-center justify-between",onSwiper:G,spaceBetween:12,slidesPerView:6,freeMode:!0,watchSlidesProgress:!0,modules:[b.Navigation,b.Thumbs],children:e?.galleries?.map((i,o)=>(0,t.jsx)(w.SwiperSlide,{className:"[&.swiper-slide-thumb-active]:border-brand !w-auto cursor-pointer border border-transparent [&.swiper-slide-thumb-active]:rounded",children:(0,t.jsx)(k.Picture,{source:i.image?.url,alt:i.image?.altText,className:"lg-desktop:size-12 size-10 overflow-hidden rounded bg-white",imgClassName:"object-cover h-full"})},e?.id+"SwiperSlideThumbItem"+o))})}),!e?.index&&(0,t.jsxs)("div",{className:"flex items-center gap-2",children:[(0,t.jsx)(k.Picture,{source:e?.comment?.avatar?.url,className:"laptop:size-10 size-8 shrink-0 rounded-full",imgClassName:"object-cover "}),(0,t.jsxs)("div",{className:"relative max-w-[528px]",children:[(0,t.jsx)("div",{ref:A,className:"lg-desktop:text-base pointer-events-none text-sm font-bold text-[#1D1D1F] opacity-0",style:{visibility:"hidden"}}),(0,t.jsx)(w.Swiper,{modules:[b.Autoplay],loop:x.length>1,className:"h-[44px]",direction:"vertical",autoplay:{delay:5e3,disableOnInteraction:!1},children:x.length>0?x.map((i,o)=>(0,t.jsx)(w.SwiperSlide,{children:(0,t.jsx)(k.Text,{html:i,as:"div",className:"lg-desktop:text-base overflow-hidden text-sm font-bold text-[#1D1D1F]"})},o+"text-group")):(0,t.jsx)(w.SwiperSlide,{children:(0,t.jsx)(k.Text,{as:"div",html:e?.comment?.content,className:"lg-desktop:text-base text-sm font-bold text-[#1D1D1F]"})})})]})]})]}),(0,t.jsx)("div",{ref:E,className:"tablet:hidden absolute inset-x-4 !bottom-[70px] z-10 text-center [&_.swiper-pagination-bullet-active]:!bg-[#080A0F] [&_.swiper-pagination-bullet]:bg-white [&_.swiper-pagination-bullet]:opacity-100"})]})});$.displayName="ProductGalleryTabImage";const me=({src:e})=>{const l=(0,a.useRef)(null);return(0,a.useEffect)(()=>{const r=l.current;r&&(r.muted=!0,r.play().catch(()=>{}))},[]),(0,t.jsxs)("video",{ref:l,playsInline:!0,autoPlay:!0,loop:!0,muted:!0,controls:!0,className:"w-full mt-20 laptop:size-full laptop:mt-0 aspect-video laptop:aspect-auto object-cover",children:[(0,t.jsx)("track",{kind:"captions"}),(0,t.jsx)("source",{src:e,type:"video/mp4"}),(0,t.jsx)("source",{src:e,type:"video/webm"}),(0,t.jsx)("source",{src:e,type:"video/ogg"})]})},be=e=>{const[l,r]=(0,a.useState)(null),S=(0,a.useCallback)(()=>{l?.isBeginning?e.onPrevTab?.():l?.slidePrev()},[l,e]),c=(0,a.useCallback)(()=>{l?.isEnd?e.onNextTab?.():l?.slideNext()},[l,e]);return(0,a.useEffect)(()=>{l&&e.targetSlideIndex!==null&&e.targetSlideIndex!==void 0&&(l.slideTo(e.targetSlideIndex,0),e.onSlideChange?.())},[l,e.targetSlideIndex,e]),(0,t.jsxs)("div",{className:"h-full [&_.swiper-button]:hover:opacity-100",children:[(0,t.jsx)(w.Swiper,{className:"h-full",onSwiper:r,onTouchEnd:(y,E)=>{y.isBeginning&&y.swipeDirection==="prev"?S():y.isEnd&&y.swipeDirection==="next"&&c()},modules:[b.Mousewheel,b.Thumbs,b.Navigation,b.Pagination],mousewheel:{forceToAxis:!0},breakpoints:{0:{slidesPerView:1,freeMode:!1}},children:e?.galleries?.map((y,E)=>(0,t.jsx)(w.SwiperSlide,{className:"h-full bg-info-primary",children:(0,t.jsx)(me,{src:y?.sources?.[0]?.url})},e?.id+"SwiperSlideItem"+E))}),(0,t.jsx)("div",{className:(0,P.cn)("swiper-button tablet:block tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:left-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:S,children:(0,t.jsx)(q,{className:"tablet:size-10 lg-desktop:size-12"})}),(0,t.jsx)("div",{className:(0,P.cn)("tablet:block swiper-button tablet:opacity-0 tablet:absolute tablet:top-1/2 tablet:right-6 z-10 hidden -translate-y-1/2 cursor-pointer"),onClick:c,children:(0,t.jsx)(U,{className:"tablet:size-10 lg-desktop:size-12"})})]})},ye=e=>(0,t.jsx)("div",{children:"3D View"});var ge=(0,te.withLayout)(pe);

package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGridBox.js

@@ -1 +1 @@
-"use strict";var c=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var r=Object.prototype.hasOwnProperty;var i=(a,p)=>{for(var t in p)c(a,t,{get:p[t],enumerable:!0})},x=(a,p,t,e)=>{if(p&&typeof p=="object"||typeof p=="function")for(let l of s(p))!r.call(a,l)&&l!==t&&c(a,l,{get:()=>p[l],enumerable:!(e=m(p,l))||e.enumerable});return a};var g=a=>x(c({},"__esModule",{value:!0}),a);var R={};i(R,{default:()=>N});module.exports=g(R);var o=require("react/jsx-runtime"),d=require("../../../../components/index.js");const G=({BoxLeftGallery:a,BoxRightDetail:p,BoxBottomSummary:t})=>(0,o.jsxs)("div",{id:"ipc-product-card",className:"laptop-md:pt-6 laptop-md:px-16 lg-desktop:px-[calc(50%-832px)]",children:[(0,o.jsxs)(d.Grid,{className:"laptop-md:gap-x-4 lg-desktop:gap-6 gap-8 laptop:gap-y-8 laptop-md:gap-y-8",children:[(0,o.jsx)(d.GridItem,{className:"laptop:px-0 laptop-md:col-start-1 laptop-md:col-span-8 laptop-md:sticky laptop-md:top-[124px] col-span-12 h-fit",children:a}),(0,o.jsx)(d.GridItem,{className:"laptop-md:col-start-9 laptop-md:col-span-4 col-span-12",children:p})]}),t]});var N=G;
+"use strict";var c=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var r=Object.prototype.hasOwnProperty;var s=(t,p)=>{for(var a in p)c(t,a,{get:p[a],enumerable:!0})},x=(t,p,a,e)=>{if(p&&typeof p=="object"||typeof p=="function")for(let d of m(p))!r.call(t,d)&&d!==a&&c(t,d,{get:()=>p[d],enumerable:!(e=i(p,d))||e.enumerable});return t};var g=t=>x(c({},"__esModule",{value:!0}),t);var R={};s(R,{default:()=>N});module.exports=g(R);var o=require("react/jsx-runtime"),l=require("../../../../components/index.js");const G=({BoxLeftGallery:t,BoxRightDetail:p,BoxBottomSummary:a})=>(0,o.jsxs)("div",{id:"ipc-product-card",className:"laptop-md:pt-6 laptop-md:px-16 lg-desktop:px-[calc(50%-832px)]",children:[(0,o.jsxs)(l.Grid,{className:"ipc-box-grid laptop-md:gap-x-4 lg-desktop:gap-6 gap-8 laptop:gap-y-8 laptop-md:gap-y-8",children:[(0,o.jsx)(l.GridItem,{className:"ipc-box-left-grid-item laptop:px-0 laptop-md:col-start-1 laptop-md:col-span-8 laptop-md:sticky laptop-md:top-[124px] col-span-12 h-fit",children:t}),(0,o.jsx)(l.GridItem,{className:"ipc-box-right-grid-item laptop-md:col-start-9 laptop-md:col-span-4 col-span-12",children:p})]}),a]});var N=G;

package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.d.ts

@@ -1,7 +1,13 @@
 import { type ReactNode } from 'react';
+export interface ComparePriceRenderData {
+    /** 划线价金额 */
+    comparePrice: number;
+}
 export interface ProductActionsProps {
     /** 自定义总节省组件，传入时会替代默认的 totalSavings 显示 */
     totalSavingsSlot?: ReactNode;
+    /** 自定义划线价渲染，传入时替换默认的划线价显示 */
+    renderComparePrice?: (data: ComparePriceRenderData) => ReactNode;
 }
-declare const ProductActions: ({ totalSavingsSlot }?: ProductActionsProps) => import("react/jsx-runtime").JSX.Element;
+declare const ProductActions: ({ totalSavingsSlot, renderComparePrice }?: ProductActionsProps) => import("react/jsx-runtime").JSX.Element;
 export default ProductActions;

package/dist/cjs/biz-components/Listing/components/PurchaseBar/ProductActions/index.js

@@ -1 +1 @@
-"use strict";var j=Object.create;var u=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var U=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var $=(t,e)=>{for(var o in e)u(t,o,{get:e[o],enumerable:!0})},h=(t,e,o,c)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of z(e))!W.call(t,n)&&n!==o&&u(t,n,{get:()=>e[n],enumerable:!(c=q(e,n))||c.enumerable});return t};var G=(t,e,o)=>(o=t!=null?j(U(t)):{},h(e||!t||!t.__esModule?u(o,"default",{value:t,enumerable:!0}):o,t)),H=t=>h(u({},"__esModule",{value:!0}),t);var K={};$(K,{default:()=>J});module.exports=H(K);var a=require("react/jsx-runtime"),r=require("../../../../../components/index.js"),w=require("../../../../AiuiProvider/index.js"),S=require("../../../BizProductProvider.js"),b=require("react"),i=require("../../../utils/index.js"),f=require("../../../utils/textFormat.js"),T=require("../../../hooks/useBenefits.js"),k=G(require("../../CartActionButtons/index.js"));const I=({totalSavingsSlot:t}={})=>{const{copyWriting:e,locale:o="us",trackingData:c,currencyCode:n}=(0,w.useAiuiContext)(),{variant:l,finalPrice:A,totalSavings:d,isLogin:p,comparePrice:M,onAddToCart:P,onBuyNow:D,savingDetail:x,addToCartLoading:B,buyNowLoading:F,notifyMeMode:L,onNotifyMeClick:E,discount:Q,memberFunctionResult:g}=(0,S.useBizProductContext)(),R=(0,T.useBenefits)({variant:l}),{commonCoupon:m,memberDiscount:s}=R,O=c?.showComparePrice??!0,_=(0,b.useMemo)(()=>(0,f.replaceTemplate)(e?.totalSavings||"",{amount:(0,i.formatPrice)({amount:d,currencyCode:l.price.currencyCode,locale:n==="CAD"?"us":o||"us"})}),[e?.totalSavings,d,l.price.currencyCode,o]),C=(0,b.useMemo)(()=>{if(!e?.unlockedSaving)return;const y=m?.enable?Number(m?.config?.fixed_value||0):0,v=s?.enable?s.config?.amount??0:0,N=Math.round((g?.withoutCouponMaxMemberTotalSave?Math.max(v,y):v+y)*100)/100;if(!(N<=0))return(0,f.replaceTemplate)(e.unlockedSaving,{amount:(0,i.formatPrice)({amount:N,currencyCode:l.price.currencyCode,locale:n==="CAD"?"us":o||"us"})})},[e?.unlockedSaving,m?.enable,m?.config?.fixed_value,s?.enable,s?.config?.amount,g,l.price.currencyCode,o]);return(0,a.jsxs)(r.Container,{childClassName:"tablet:flex tablet:justify-end tablet:gap-8 laptop-md:px-0 desktop:px-0 tablet:items-center tablet:gap-4",className:"laptop-md:border-none laptop-md:py-0 border-t border-[#E4E5E6] bg-white py-3",children:[l.availableForSale?(0,a.jsxs)("div",{className:"laptop-md:items-end flex flex-col justify-between",children:[(0,a.jsxs)("div",{className:"flex items-center gap-1",children:[(0,a.jsx)(r.Text,{className:"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2]",html:(0,i.formatPrice)({amount:parseFloat(A.toFixed(2)),currencyCode:l.price.currencyCode,locale:n==="CAD"?"us":o||"us"})}),O&&(d>0||x?.member>0&&p)&&(0,a.jsx)(r.Text,{className:"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2] text-[#4A4C56] line-through",html:(0,i.formatPrice)({amount:M,currencyCode:l.price.currencyCode,locale:n==="CAD"?"us":o||"us"})}),x?.member>0&&p&&(0,a.jsx)(r.Text,{className:"bg-brand-0 rounded px-1 py-[2px] text-sm font-bold text-white",html:e?.memberPrice||"Member Price"})]}),t||(d>0||x?.member>0&&p?(0,a.jsx)(r.Text,{className:"text-brand-0 tablet:text-end laptop-md:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]",html:`${_}`}):C?(0,a.jsx)(r.Text,{className:"text-info-quaternary tablet:text-end laptop-md:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]",html:C}):null)]}):(0,a.jsx)(r.Text,{className:"text-[20px] font-bold text-[#999999]",html:e?.soldOut??"Sold Out"}),(0,a.jsx)("div",{className:"tablet:mt-0 mt-2 flex items-center gap-2",children:(0,a.jsx)(k.default,{mode:L,availableForSale:l.availableForSale,addToCartText:e?.addToCart??"Add to Cart",buyNowText:e?.buyNow??"Buy Now",addToCartLoading:B,buyNowLoading:F,onAddToCart:P,onBuyNow:D,onNotifyMeClick:E,notifyMeText:e?.notifyMe,notifyMeClassName:"w-full"})})]})};var J=I;
+"use strict";var q=Object.create;var p=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var W=Object.getPrototypeOf,$=Object.prototype.hasOwnProperty;var G=(t,o)=>{for(var e in o)p(t,e,{get:o[e],enumerable:!0})},S=(t,o,e,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of U(o))!$.call(t,i)&&i!==e&&p(t,i,{get:()=>o[i],enumerable:!(n=z(o,i))||n.enumerable});return t};var H=(t,o,e)=>(e=t!=null?q(W(t)):{},S(o||!t||!t.__esModule?p(e,"default",{value:t,enumerable:!0}):e,t)),I=t=>S(p({},"__esModule",{value:!0}),t);var Q={};G(Q,{default:()=>K});module.exports=I(Q);var a=require("react/jsx-runtime"),l=require("../../../../../components/index.js"),P=require("../../../../AiuiProvider/index.js"),T=require("../../../BizProductProvider.js"),f=require("react"),c=require("../../../utils/index.js"),g=require("../../../utils/textFormat.js"),k=require("../../../hooks/useBenefits.js"),A=H(require("../../CartActionButtons/index.js"));const J=({totalSavingsSlot:t,renderComparePrice:o}={})=>{const{copyWriting:e,locale:n="us",trackingData:i,currencyCode:d}=(0,P.useAiuiContext)(),{variant:r,finalPrice:M,totalSavings:m,isLogin:x,comparePrice:C,onAddToCart:D,onBuyNow:B,savingDetail:b,addToCartLoading:F,buyNowLoading:R,notifyMeMode:L,onNotifyMeClick:E,discount:V,memberFunctionResult:y}=(0,T.useBizProductContext)(),O=(0,k.useBenefits)({variant:r}),{commonCoupon:s,memberDiscount:u}=O,_=i?.showComparePrice??!0,j=(0,f.useMemo)(()=>(0,g.replaceTemplate)(e?.totalSavings||"",{amount:(0,c.formatPrice)({amount:m,currencyCode:r.price.currencyCode,locale:d==="CAD"?"us":n||"us"})}),[e?.totalSavings,m,r.price.currencyCode,n]),v=(0,f.useMemo)(()=>{if(!e?.unlockedSaving)return;const N=s?.enable?Number(s?.config?.fixed_value||0):0,h=u?.enable?u.config?.amount??0:0,w=Math.round((y?.withoutCouponMaxMemberTotalSave?Math.max(h,N):h+N)*100)/100;if(!(w<=0))return(0,g.replaceTemplate)(e.unlockedSaving,{amount:(0,c.formatPrice)({amount:w,currencyCode:r.price.currencyCode,locale:d==="CAD"?"us":n||"us"})})},[e?.unlockedSaving,s?.enable,s?.config?.fixed_value,u?.enable,u?.config?.amount,y,r.price.currencyCode,n]);return(0,a.jsxs)(l.Container,{childClassName:"tablet:flex tablet:justify-end tablet:gap-8 laptop-md:px-0 desktop:px-0 tablet:items-center tablet:gap-4",className:"laptop-md:border-none laptop-md:py-0 border-t border-[#E4E5E6] bg-white py-3",children:[r.availableForSale?(0,a.jsxs)("div",{className:"laptop-md:items-end flex flex-col justify-between",children:[(0,a.jsxs)("div",{className:"flex items-center gap-1",children:[(0,a.jsx)(l.Text,{className:"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2]",html:(0,c.formatPrice)({amount:parseFloat(M.toFixed(2)),currencyCode:r.price.currencyCode,locale:d==="CAD"?"us":n||"us"})}),o?o({comparePrice:C}):_&&(m>0||b?.member>0&&x)&&(0,a.jsx)(l.Text,{className:"tablet:text-2xl laptop-md:text-xl lg-desktop:text-2xl text-xl font-bold !leading-[1.2] text-[#4A4C56] line-through",html:(0,c.formatPrice)({amount:C,currencyCode:r.price.currencyCode,locale:d==="CAD"?"us":n||"us"})}),b?.member>0&&x&&(0,a.jsx)(l.Text,{className:"bg-brand-0 rounded px-1 py-[2px] text-sm font-bold text-white",html:e?.memberPrice||"Member Price"})]}),t||(m>0||b?.member>0&&x?(0,a.jsx)(l.Text,{className:"text-brand-0 tablet:text-end laptop-md:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]",html:`${j}`}):v?(0,a.jsx)(l.Text,{className:"text-info-quaternary tablet:text-end laptop-md:text-xl lg-desktop:text-2xl whitespace-nowrap text-[18px] font-bold !leading-[1.2]",html:v}):null)]}):(0,a.jsx)(l.Text,{className:"text-[20px] font-bold text-[#999999]",html:e?.soldOut??"Sold Out"}),(0,a.jsx)("div",{className:"tablet:mt-0 mt-2 flex items-center gap-2",children:(0,a.jsx)(A.default,{mode:L,availableForSale:r.availableForSale,addToCartText:e?.addToCart??"Add to Cart",buyNowText:e?.buyNow??"Buy Now",addToCartLoading:F,buyNowLoading:R,onAddToCart:D,onBuyNow:B,onNotifyMeClick:E,notifyMeText:e?.notifyMe,notifyMeClassName:"w-full"})})]})};var K=J;

package/dist/cjs/biz-components/Listing/components/PurchaseBar/index.js

@@ -1 +1 @@
-"use strict";var b=Object.create;var s=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var w=(t,e)=>{for(var r in e)s(t,r,{get:e[r],enumerable:!0})},m=(t,e,r,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of h(e))!g.call(t,o)&&o!==r&&s(t,o,{get:()=>e[o],enumerable:!(l=v(e,o))||l.enumerable});return t};var P=(t,e,r)=>(r=t!=null?b(N(t)):{},m(e||!t||!t.__esModule?s(r,"default",{value:t,enumerable:!0}):r,t)),y=t=>m(s({},"__esModule",{value:!0}),t);var C={};w(C,{default:()=>B});module.exports=y(C);var a=require("react/jsx-runtime"),i=require("../../../../components/index.js"),n=require("../index.js"),c=require("../../BizProductProvider.js"),u=require("../../hooks/useComponentData.js"),p=P(require("./ScrollSpyNav/index.js")),f=require("../../../../shared/Styles.js");const x=({onSpyNavItemClick:t,totalSavingsSlot:e,actionsSlot:r})=>{const{product:l,renderRating:o}=(0,c.useBizProductContext)(),d=(0,u.useComponentData)("PurchaseBar")??[];return(0,a.jsxs)("div",{id:"purchase-bar",className:"sticky left-0 top-0 z-[45] w-full border-b border-[#E4E5E6] bg-white",children:[(0,a.jsx)(i.Container,{children:(0,a.jsxs)("div",{className:"tablet:justify-between laptop-md:gap-16 tablet:gap-0 tablet:w-full flex flex-wrap items-center gap-[10px]",children:[(0,a.jsxs)("div",{className:"laptop-md:pt-6 laptop-md:pb-0 min-w-0 flex-1 py-3",children:[(0,a.jsx)(i.Heading,{as:"h1",size:2,className:"line-clamp-2 text-wrap",html:l?.title}),(0,a.jsx)("div",{className:"laptop-md:block mt-3 hidden",children:(0,a.jsx)(p.default,{tabs:d,className:"",renderRating:o,onSpyNavItemClick:t})})]}),(0,a.jsx)("div",{className:"laptop-md:block hidden shrink-0",children:r??(0,a.jsx)(n.ProductActions,{totalSavingsSlot:e})})]})}),(0,a.jsxs)(i.Container,{className:"laptop-md:hidden relative",children:[(0,a.jsx)("div",{className:"absolute left-0 top-0 h-px w-full bg-[#E4E5E6]"}),(0,a.jsx)(p.default,{tabs:d,renderRating:o,onSpyNavItemClick:t})]})]})};var B=(0,f.withLayout)(x);
+"use strict";var v=Object.create;var p=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var g=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var w=(a,e)=>{for(var r in e)p(a,r,{get:e[r],enumerable:!0})},n=(a,e,r,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of N(e))!P.call(a,o)&&o!==r&&p(a,o,{get:()=>e[o],enumerable:!(l=h(e,o))||l.enumerable});return a};var y=(a,e,r)=>(r=a!=null?v(g(a)):{},n(e||!a||!a.__esModule?p(r,"default",{value:a,enumerable:!0}):r,a)),x=a=>n(p({},"__esModule",{value:!0}),a);var E={};w(E,{default:()=>B});module.exports=x(E);var t=require("react/jsx-runtime"),i=require("../../../../components/index.js"),c=require("../index.js"),u=require("../../BizProductProvider.js"),f=require("../../hooks/useComponentData.js"),s=y(require("./ScrollSpyNav/index.js")),b=require("../../../../shared/Styles.js");const C=({onSpyNavItemClick:a,totalSavingsSlot:e,actionsSlot:r,renderComparePrice:l})=>{const{product:o,renderRating:d}=(0,u.useBizProductContext)(),m=(0,f.useComponentData)("PurchaseBar")??[];return(0,t.jsxs)("div",{id:"purchase-bar",className:"sticky left-0 top-0 z-[45] w-full border-b border-[#E4E5E6] bg-white",children:[(0,t.jsx)(i.Container,{children:(0,t.jsxs)("div",{className:"tablet:justify-between laptop-md:gap-16 tablet:gap-0 tablet:w-full flex flex-wrap items-center gap-[10px]",children:[(0,t.jsxs)("div",{className:"laptop-md:pt-6 laptop-md:pb-0 min-w-0 flex-1 py-3",children:[(0,t.jsx)(i.Heading,{as:"h1",size:2,className:"line-clamp-2 text-wrap",html:o?.title}),(0,t.jsx)("div",{className:"laptop-md:block mt-3 hidden",children:(0,t.jsx)(s.default,{tabs:m,className:"",renderRating:d,onSpyNavItemClick:a})})]}),(0,t.jsx)("div",{className:"laptop-md:block hidden shrink-0",children:r??(0,t.jsx)(c.ProductActions,{totalSavingsSlot:e,renderComparePrice:l})})]})}),(0,t.jsxs)(i.Container,{className:"laptop-md:hidden relative",children:[(0,t.jsx)("div",{className:"absolute left-0 top-0 h-px w-full bg-[#E4E5E6]"}),(0,t.jsx)(s.default,{tabs:m,renderRating:d,onSpyNavItemClick:a})]})]})};var B=(0,b.withLayout)(C);

package/dist/cjs/biz-components/Listing/components/PurchaseBar/types.d.ts

@@ -1,10 +1,13 @@
 import type { ReactNode } from 'react';
+import type { ComparePriceRenderData } from './ProductActions/index.js';
 export interface PurchaseBarProps {
     onSpyNavItemClick?: (tab: ScrollSpyNavItem) => void;
     /** 自定义总节省组件，传入时会替代默认的 totalSavings 显示 */
     totalSavingsSlot?: ReactNode;
     /** 自定义右侧 Actions 插槽，传入时替代默认的 ProductActions */
     actionsSlot?: ReactNode;
+    /** 自定义划线价渲染，传入时替换默认的划线价显示 */
+    renderComparePrice?: (data: ComparePriceRenderData) => ReactNode;
 }
 export interface ScrollSpyNavItem {
     label: string;

package/dist/cjs/biz-components/Listing/components/PurchaseBar/types.js

@@ -1 +1 @@
-"use strict";var o=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var s=(t,e,c,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of l(e))!p.call(t,r)&&r!==c&&o(t,r,{get:()=>e[r],enumerable:!(a=i(e,r))||a.enumerable});return t};var S=t=>s(o({},"__esModule",{value:!0}),t);var n={};module.exports=S(n);
+"use strict";var o=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var l=(r,e,c,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of p(e))!n.call(r,t)&&t!==c&&o(r,t,{get:()=>e[t],enumerable:!(a=i(e,t))||a.enumerable});return r};var s=r=>l(o({},"__esModule",{value:!0}),r);var d={};module.exports=s(d);

package/dist/cjs/helpers/utils.js

@@ -1 +1 @@
-"use strict";var g=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var a=(t,e)=>{for(var r in e)g(t,r,{get:e[r],enumerable:!0})},b=(t,e,r,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of h(e))!d.call(t,i)&&i!==r&&g(t,i,{get:()=>e[i],enumerable:!(n=$(e,i))||n.enumerable});return t};var y=t=>b(g({},"__esModule",{value:!0}),t);var T={};a(T,{atobID:()=>W,cn:()=>w,getLocalizedPath:()=>z,highlightSearchWord:()=>j,noop:()=>R,replaceTemplate:()=>S,spaceToHyphen:()=>E});module.exports=y(T);var u=require("clsx"),f=require("tailwind-merge");const p=(0,f.extendTailwindMerge)({extend:{theme:{borderRadius:["btn"]},classGroups:{"font-size":["text-heading-1","text-heading-2","text-heading-3","text-heading-4","text-heading-5","text-text-3","text-text-2","text-text-1"],"text-color":["text-info-primary","text-info-secondary","text-info-tertiary","text-info-quaternary","text-info-white"],leading:["leading-tight","leading-normal","leading-loose"]}}});function w(...t){return p((0,u.clsx)(t))}function R(){}function W(t){return t&&typeof t=="string"&&t.includes("/")?t.split("/").pop()?.split("?")?.shift():t}const E=t=>t?.replace(/\s+/g,"-"),c=t=>t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),S=(t,e,r="{",n="}")=>{if(!t||!e||Object.keys(e).length===0)return t;const i=c(r),o=c(n),s=new RegExp(`${i}([a-zA-Z0-9_-]+)${o}`,"g");return t.replace(s,(l,x)=>e[x]!==void 0?e[x]:l)},j=(t,e)=>{try{if(!t||!e)return t;const r=c(e),n=new RegExp(r,"gi");return t.replace(n,i=>`<span class='text-brand-0 font-bold'>${i}</span>`)}catch(r){return console.error("highlightSearchWord error:",r),t}},z=(t,e,r)=>{if(!t)return t;if(t.startsWith("http://")||t.startsWith("https://")||t.startsWith("#"))return r?t.includes("?")?`${t}&${r}`:`${t}?${r}`:t;const n=t.split("/").filter(Boolean);if(n.length===0){const s=e==="us"?"/":`/${e}`;return r?`${s}?${r}`:s}if(n[0]===e){const s=`/${n.join("/")}`;return r?`${s}?${r}`:s}const o=`${e==="us"?"":`/${e}`}/${n.join("/")}`;return r?`${o}?${r}`:o};
+"use strict";var g=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var a=(t,e)=>{for(var r in e)g(t,r,{get:e[r],enumerable:!0})},b=(t,e,r,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of $(e))!d.call(t,i)&&i!==r&&g(t,i,{get:()=>e[i],enumerable:!(n=h(e,i))||n.enumerable});return t};var y=t=>b(g({},"__esModule",{value:!0}),t);var T={};a(T,{atobID:()=>W,cn:()=>w,getLocalizedPath:()=>z,highlightSearchWord:()=>j,noop:()=>R,replaceTemplate:()=>S,spaceToHyphen:()=>E});module.exports=y(T);var u=require("clsx"),l=require("tailwind-merge");const p=(0,l.extendTailwindMerge)({extend:{theme:{borderRadius:["btn","box","box-small","card","tabs","sidebar-shelf","image-text"]},classGroups:{"font-size":["text-heading-1","text-heading-2","text-heading-3","text-heading-4","text-heading-5","text-text-3","text-text-2","text-text-1"],"text-color":["text-info-primary","text-info-secondary","text-info-tertiary","text-info-quaternary","text-info-white"],leading:["leading-tight","leading-normal","leading-loose"]}}});function w(...t){return p((0,u.clsx)(t))}function R(){}function W(t){return t&&typeof t=="string"&&t.includes("/")?t.split("/").pop()?.split("?")?.shift():t}const E=t=>t?.replace(/\s+/g,"-"),c=t=>t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"),S=(t,e,r="{",n="}")=>{if(!t||!e||Object.keys(e).length===0)return t;const i=c(r),o=c(n),s=new RegExp(`${i}([a-zA-Z0-9_-]+)${o}`,"g");return t.replace(s,(f,x)=>e[x]!==void 0?e[x]:f)},j=(t,e)=>{try{if(!t||!e)return t;const r=c(e),n=new RegExp(r,"gi");return t.replace(n,i=>`<span class='text-brand-0 font-bold'>${i}</span>`)}catch(r){return console.error("highlightSearchWord error:",r),t}},z=(t,e,r)=>{if(!t)return t;if(t.startsWith("http://")||t.startsWith("https://")||t.startsWith("#"))return r?t.includes("?")?`${t}&${r}`:`${t}?${r}`:t;const n=t.split("/").filter(Boolean);if(n.length===0){const s=e==="us"?"/":`/${e}`;return r?`${s}?${r}`:s}if(n[0]===e){const s=`/${n.join("/")}`;return r?`${s}?${r}`:s}const o=`${e==="us"?"":`/${e}`}/${n.join("/")}`;return r?`${o}?${r}`:o};

package/dist/esm/biz-components/ActiveShelf/MemberLabel.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import type { Img } from '../../types/props.js';
+import type { UserType, CopyConfig, ActiveShelfLayoutMode } from './types.js';
+export type { UserType };
+/**
+ * 会员标签模块 Props
+ */
+export interface MemberLabelProps {
+    /** 用户身份 */
+    userType: UserType;
+    /** 文案配置 */
+    copy?: CopyConfig;
+    /** 三种状态的装饰图 */
+    images?: Partial<Record<UserType, Img>>;
+    /** 点击游客副标题（注册/登录）回调 */
+    onSignUp?: () => void;
+    /** 点击付费会员折扣文案（加购付费会员sku）回调 */
+    onPlusMemberAddCart?: () => void;
+    /** 样式类名 */
+    className?: string;
+    /** 是否配置会员活动（activityLabels 中存在 type=activity） */
+    hasActivity?: boolean;
+    /** 会员活动默认文案（来自 activityLabels 中对应 type 的 label，优先级高于 copy） */
+    activityLabel?: string;
+    /** 普通会员折扣金额（格式化后的字符串，如 '$20'），用于替换 copy.memberDiscountLabel 中的 {amount} 占位符 */
+    memberDiscountAmount?: string;
+    /** 付费会员折扣金额（格式化后的字符串，如 '$30'），用于替换 copy.plusMemberDiscountLabel 中的 {amount} 占位符 */
+    plusMemberDiscountAmount?: string;
+    /** 布局模式：flex=网格布局，horizontal=横向轮播，用于切换左右内边距 */
+    layoutMode?: ActiveShelfLayoutMode;
+}
+/**
+ * MemberLabel - 会员身份标签模块
+ *
+ * @description 展示用户身份对应的会员权益提示条，支持三种身份状态：
+ * - guest（游客）：灰底 + 深色字，副标题为可点击的注册/登录链接
+ * - member（普通会员）：浅青渐变 + 深色字
+ * - plus-member（付费会员）：青→深蓝渐变 + 白字
+ */
+declare const MemberLabel: React.ForwardRefExoticComponent<MemberLabelProps & React.RefAttributes<HTMLDivElement>>;
+export { MemberLabel };
+export default MemberLabel;

package/dist/esm/biz-components/ActiveShelf/MemberLabel.js

@@ -0,0 +1 @@
+"use client";import{jsx as n,jsxs as s}from"react/jsx-runtime";import*as k from"react";import{cn as i}from"../../helpers/index.js";import{Picture as E,Text as u}from"../../components/index.js";import{layoutModeStyles as P}from"./styles.js";const R={guest:{backgroundColor:"#d4d8d9"},member:{backgroundImage:"linear-gradient(228.5deg, #d4f3f7 35.268%, #93e0ec 97.62%)"},"plus-member":{backgroundImage:"linear-gradient(-11.59deg, #00cbeb 7.658%, #010f16 50.658%)"}},d={guest:"Unlock Member Price",member:"Member Exclusive","plus-member":"Plus Member Exclusive"},p=k.forwardRef(({userType:r,copy:t,images:h,onSignUp:f,onPlusMemberAddCart:g,className:S,hasActivity:o,activityLabel:m,memberDiscountAmount:x,plusMemberDiscountAmount:a,layoutMode:U},M)=>{const C=r==="plus-member",v=r==="guest",T=r==="member",c=h?.[r],l=P[U??"flex"],A=(()=>{switch(r){case"guest":return t?.memberTitleLabelUpgrade??d.guest;case"member":return t?.memberTitleLabel??d.member;case"plus-member":return t?.plusmemberTitleLabel??d["plus-member"]}})(),L=(()=>{if(v){const e=[];return x&&t?.memberDiscountLabel?e.push({text:t.memberDiscountLabel.replace("{amount}",x),action:"signUp"}):a&&t?.plusMemberDiscountLabel&&e.push({text:t.plusMemberDiscountLabel.replace("{amount}",a),action:"plusAddCart"}),o&&e.push({text:m??t?.memberActivityLabelUnLogin??"",action:"signUp"}),e}if(T){const e=[];return a&&t?.plusMemberDiscountLabel&&e.push({text:t.plusMemberDiscountLabel.replace("{amount}",a),action:"plusAddCart"}),o&&e.push({text:m??t?.memberActivityLabel??"",action:"none"}),e}return o?[{text:m??t?.memberActivityLabel??"",action:"none"}]:[]})();if(v&&L.length===0)return null;const D=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),f?.())},N=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),g?.())};return s("div",{ref:M,className:i(l.memberLabelContainer,"laptop:min-h-[64px] desktop:min-h-[76px] lg-desktop:min-h-[82px] relative box-border flex min-h-[50px] flex-col items-start justify-center overflow-hidden",S,C&&"aiui-dark"),style:R[r],children:[c?.url&&n("div",{className:i("laptop:size-[86px] lg-desktop:size-[114px] absolute -right-5 top-1/2 size-16 -translate-y-1/2 "),children:n("div",{className:"absolute inset-0",children:n(E,{source:c.url,alt:c.alt||"",className:"block size-full",imgClassName:"block max-w-none size-full object-left object-cover "})})}),s("div",{className:"relative flex w-full shrink-0 flex-col items-start",children:[n(u,{as:"p",className:i("text-info-primary line-clamp-1 font-bold not-italic leading-[1.4] tracking-[-0.02em]",l.memberLabelText),html:A}),n("div",{className:"line-clamp-2 w-full !leading-[1.4]",children:L.map((e,y)=>{const b=e.action!=="none";return s(k.Fragment,{children:[y>0&&s(u,{as:"span",className:i("text-info-tertiary font-bold !leading-[1.4] tracking-[-0.02em]",l.memberLabelText),children:["\xA0","&","\xA0"]}),n(u,{as:"span",role:b?"button":void 0,tabIndex:b?0:void 0,onClick:e.action==="signUp"?()=>f?.():e.action==="plusAddCart"?()=>g?.():void 0,onKeyDown:e.action==="signUp"?D:e.action==="plusAddCart"?N:void 0,className:i("text-info-tertiary font-bold !leading-[1.4] tracking-[-0.02em]",l.memberLabelText),style:{...b?{textDecoration:"underline",textUnderlinePosition:"from-font",cursor:"pointer"}:{}},html:e.text})]},y)})})]})]})});p.displayName="ActiveShelf.MemberLabel";var z=p;export{p as MemberLabel,z as default};

package/dist/esm/biz-components/ActiveShelf/ProductCard.d.ts

@@ -1,14 +1,21 @@
 import * as React from 'react';
-import type { ButtonFunctionType, CopyConfig } from './types.js';
+import type { ButtonFunctionType, CopyConfig, UserType, ActivityLabel, DiscountTagStyle, ActiveShelfLayoutMode, TagTypeConfig, TagColorConfig } from './types.js';
 import type { BadgeProps } from '../../components/badge.js';
+import type { Img } from '../../types/props.js';
 /**
  * 语义化类名
  */
-export type ActiveShelfSemanticName = 'root' | 'title' | 'description' | 'productCard' | 'productTitle' | 'productDescription' | 'productPriceLabel' | 'productPrice' | 'originalPrice' | 'buttonGroup' | 'secondaryButton' | 'primaryButton' | 'stockTrack' | 'stockBar';
+export type ActiveShelfSemanticName = 'root' | 'title' | 'description' | 'tabsList' | 'promotionalBar' | 'productCard' | 'discountBadge' | 'discountBadgeText' | 'productTitle' | 'productDescription' | 'productPriceLabel' | 'productPrice' | 'originalPrice' | 'buttonGroup' | 'secondaryButton' | 'primaryButton' | 'stockTrack' | 'stockBar';
 /**
  * 库存展示模式
  */
 export type StockDisplayMode = 'always' | 'never' | 'below-quantity' | 'below-percentage';
+interface SocialEndorsementItem {
+    /** 图标：图片 URL 字符串，或 SVG React 节点 */
+    icon: string | React.ReactNode;
+    /** 无障碍标签 */
+    label?: string;
+}
 /**
  * 基础产品数据接口（来自外部数据源）
  */
@@ -21,6 +28,10 @@ export interface BaseProductData {
     shopify_id: string;
     custom_name?: string;
     custom_description?: string;
+    /** 自定义产品卡片背景图 URL */
+    custom_bg_image?: string | null;
+    /** 自定义产品卡片场景图 URL（鼠标 hover 时覆盖背景图） */
+    custom_scene_image?: string | null;
 }
 /**
  * Shopify 变体数据接口
@@ -74,6 +85,16 @@ export interface VariantData {
      * 通用折扣数据，包括折扣title, 类型和值
      */
     coupon: any;
+    /** 社媒背书图标（socialEndorsements: SocialEndorsementItem[] */
+    socialEndorsements?: SocialEndorsementItem[];
+    /** 普通会员折扣金额（格式化后的字符串，如 '$20'） */
+    memberDiscountAmount?: string;
+    /** 付费会员折扣金额（格式化后的字符串，如 '$30'） */
+    plusMemberDiscountAmount?: string;
+    /** 折扣金额（string 类型，用于左上角折扣标签展示） */
+    discountAmount?: string;
+    /** SKU 会员活动配置（对象数组，每项含 type 与 label） */
+    activityLabels?: ActivityLabel[];
 }
 /**
  * 完整的产品卡片数据接口
@@ -90,6 +111,12 @@ export interface ProductCardProps {
     className?: string;
     /** 是否展示标签系统 */
     showTags?: boolean;
+    /** 是否展示价格标签 */
+    isShowPricesTag?: boolean;
+    /** 是否展示会员价格与价格标签（价格下方的会员标签，如 Member Price） */
+    showMemberPrice?: boolean;
+    /** 布局模式：网格布局(flex)或横向轮播(horizontal)，用于切换 CardContent/MemberLabel 间距 */
+    layoutMode?: ActiveShelfLayoutMode;
     /** 库存展示模式 */
     stockDisplayMode?: StockDisplayMode;
     /** 库存阈值（当模式为 below-quantity 或 below-percentage 时使用） */
@@ -123,7 +150,33 @@ export interface ProductCardProps {
     }) => React.ReactNode;
     /** 文案配置 */
     copy?: CopyConfig;
+    /** 点击产品图片 / 场景图 / 标题跳转详情回调；未传时回退到 product.listingLink */
     onProductImageClick?: (product: ProductCardData) => void;
+    /** 标签形态配置：按位置（第 0/第 1 个）指定形态，优先于 tag 数据自带 variant 与默认规则 */
+    tagTypeConfig?: TagTypeConfig;
+    /** fill 形态标签颜色（bgColor=背景色，outlineColor=描边色），覆盖默认品牌色 */
+    fill?: TagColorConfig['fill'];
+    /** outline 形态标签颜色（outlineColor=描边色，bgColor=背景色），覆盖默认品牌色 */
+    outline?: TagColorConfig['outline'];
+    /** 会员价标签（priceLabel，如 Member Price）文字颜色。设置后会覆盖默认的品牌色 */
+    memberPriceTextColor?: string;
+    /** 用户身份（会员标签模块） */
+    userType?: UserType;
+    /** 会员标签模块三种状态的装饰图 */
+    memberImages?: Partial<Record<UserType, Img>>;
+    /** 左上角自定义标签图标 */
+    customTagsIcon?: Img;
+    /** 自定义折扣标签图标样式（style1/style2/style3 为内置预设，custom 为自定义上传） */
+    customTagStyle?: DiscountTagStyle;
+    /** 点击会员标签模块游客副标题（注册/登录）回调 */
+    onMemberSignUp?: () => void;
+    /** 点击会员标签模块付费会员折扣文案（加购付费会员sku）回调 */
+    onPlusMemberAddCart?: () => void;
+    /** 自定义折扣标签渲染（仅 customTagStyle=custom 时生效） */
+    renderDiscountBadge?: (ctx: {
+        text?: string;
+        layoutMode: ActiveShelfLayoutMode;
+    }) => React.ReactNode;
 }
 /**
  * 产品卡片组件

package/dist/esm/biz-components/ActiveShelf/ProductCard.js

@@ -1 +1 @@
-"use client";import{Fragment as O,jsx as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{cn as t}from"../../helpers/index.js";import{Button as C,Badge as M,Card as _,CardContent as $,Picture as E,Text as f,Heading as d,Progress as I}from"../../components/index.js";const j=5;function H(e,o,s,m){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return o===void 0?!0:s<=o;case"below-percentage":return o===void 0?!0:s/m*100<=o;default:return!0}}const g=l.forwardRef(({product:e,className:o,showTags:s=!0,stockDisplayMode:m,stockThresholdValue:S,onLearnMore:N,onShopNow:B,onAddToCart:D,classNames:i,secondaryButtonText:p,secondaryButtonFun:y,primaryButtonText:u,primaryButtonFun:v,showOriginalPrice:x,renderOriginalPrice:k,copy:b,onProductImageClick:h},L)=>{const[T,F]=l.useState(!1),[z,A]=l.useState(!1),R=l.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?j:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),w=async(r,c)=>{if(!r)return;const P=c==="primary"?F:A;P(!0);try{switch(r){case"buyNow":await B?.(e);break;case"addCart":await D?.(e);break;case"learnMore":await N?.(e);break;default:break}}finally{P(!1)}},q=e.availableForSale&&e.quantityAvailable<=0;return a(_,{ref:L,className:t("bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none",o,i?.productCard),children:n($,{className:"desktop:p-6 relative flex flex-1 flex-col justify-between p-4",children:[a("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:s&&e.tags?.map((r,c)=>r.label?a(M,{size:"sm",variant:r.variant||"outline",className:t(r.variant==="promotional"?"ml-2":""),promotionalType:r.promotionalType,children:r.label},c):a(l.Fragment,{children:r},c))}),a("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:a("a",{onClick:()=>h?.(e),...!h&&{href:e?.listingLink},rel:"noreferrer",children:a(E,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),n("div",{className:"flex h-full flex-1 grow flex-col justify-between",children:[n("div",{className:"mb-4",children:[a(d,{as:"h3",size:2,className:t("text-info-primary mb-2 line-clamp-2 min-h-[2.4em]",i?.productTitle),html:e.custom_name||e.name}),e?.description&&a(f,{size:2,className:t("text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 min-h-[2.4em] text-[14px]",i?.productDescription),html:e.custom_description||e.description})]}),n("div",{children:[a("div",{className:t("mb-2",i?.productPrice),children:a("div",{className:"flex items-baseline gap-2",children:e.availableForSale?n(O,{children:[a(d,{size:2,className:"text-info-primary",as:"h6",children:e.price}),k?k(e,{showOriginalPrice:x}):x&&e.originalPrice&&a(d,{size:2,className:t("text-info-tertiary line-through",i?.originalPrice),as:"h6",children:e.originalPrice})]}):a(d,{size:2,className:"text-info-tertiary",children:b?.outOfStockLabel??"Sold Out"})})}),e?.priceLabel&&e?.availableForSale&&a(f,{size:4,className:t("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",i?.productPriceLabel),children:e.priceLabel}),n("div",{className:t("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",i?.buttonGroup),children:[p&&a(C,{variant:"secondary",size:"base",className:t("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",i?.secondaryButton),onClick:()=>w(y,"secondary"),disabled:!e.availableForSale&&y!=="learnMore",loading:z,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${p}`,"data-headless-sku":e.sku,children:p}),u&&a(C,{variant:"primary",size:"base",className:t("tablet:w-fit tablet:min-w-0 tablet:whitespace-normal tablet:text-center w-full whitespace-nowrap",i?.primaryButton),onClick:()=>w(v,"primary"),disabled:!e.availableForSale&&v!=="learnMore",loading:T,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${u}`,"data-headless-sku":e.sku,children:u})]}),H(m,S,e?.quantityAvailable??0,e?.totalInventory??0)&&n("div",{className:"mt-4 space-y-2",children:[a(I,{value:R,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:t("bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]",i?.stockTrack),progressBar:t("bg-brand-0 transition-all duration-300 ease-in-out",i?.stockBar)}}),a(f,{size:3,className:"text-info-tertiary text-[14px]",children:q?b?.limitedStock:b?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]})})});g.displayName="ActiveShelf.ProductCard";var V=g;export{g as ProductCard,V as default};
+"use client";import{Fragment as ke,jsx as t,jsxs as l}from"react/jsx-runtime";import*as N from"react";import{cn as a}from"../../helpers/index.js";import{Button as $,Badge as fe,Card as ye,CardContent as pe,Picture as U,Text as C,Heading as A,Progress as ve}from"../../components/index.js";import{MemberLabel as Se}from"./MemberLabel.js";import{layoutModeStyles as G}from"./styles.js";const Ce=5;function he(e,i,r,y){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return i===void 0?!0:r<=i;case"below-percentage":return i===void 0?!0:r/y*100<=i;default:return!0}}const xe=({items:e})=>e?.length?t("div",{className:"active-shelf-display-social-endorsements desktop:gap-2 laptop:flex absolute right-0 top-0 z-10 hidden flex-col items-center gap-1",children:e.slice(0,3).map((i,r)=>typeof i.icon=="string"?t("img",{src:i.icon,alt:i.label||"",loading:"lazy",className:"desktop:size-10 lg-desktop:size-12 size-8 object-contain"},r):t(C,{"aria-label":i.label,className:"desktop:size-10 lg-desktop:size-12 size-8 [&_img]:size-full [&_svg]:size-full",children:i.icon},r))}):null,H={style1:{bg:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/2_7746fc9c-d4e4-4a59-a972-fa4cb0f3f8bd.png?v=1789381635",textClass:"aiui-dark text-info-primary"},style2:{bg:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_e0438358-493b-40cb-9a58-89d6ee2d3751.png?v=1789381628",textClass:"aiui-dark text-info-primary"},style3:{bg:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/1_19208ba4-71ea-4580-892d-72167f1cf606.png?v=1789381639",textClass:"aiui-dark text-info-primary"}},Te=({text:e,style:i="style1",icon:r,className:y,textClassName:B,layoutMode:h="flex",renderBadge:p})=>{if(!e)return null;const g=i==="custom",n=g&&!!p,v=g&&!p&&!!r?.url,S=g?void 0:H[i],m=H.style1,c=G[h],x={style1:c.discountBadgeText,style2:c.discountBadgeTextStyle2,style3:c.discountBadgeTextStyle3},T=g?c.discountBadgeTextCenter:x[i];return l("div",{className:a("active-shelf-discount-badge","absolute left-0 top-0 z-10",c.discountBadgeSize,y),children:[n?p({text:e,layoutMode:h}):v?t(U,{source:r.url,alt:r.alt||e,className:"block size-full",imgClassName:"block size-full object-contain"}):t("img",{src:(S??m).bg,alt:e,loading:"lazy",className:"block size-full object-contain"}),!n&&t(C,{className:a("active-shelf-discount-badge-text text-center","absolute inset-0 font-bold !leading-[1.2]",T,(S??m).textClass,B),html:e})]})},z=N.forwardRef(({product:e,className:i,showTags:r=!0,stockDisplayMode:y,stockThresholdValue:B,onLearnMore:h,onShopNow:p,onAddToCart:g,classNames:n,secondaryButtonText:v,secondaryButtonFun:S,primaryButtonText:m,primaryButtonFun:c,showOriginalPrice:x,renderOriginalPrice:T,copy:b,onProductImageClick:k,tagTypeConfig:_,fill:M,outline:w,memberPriceTextColor:R,userType:P,memberImages:K,customTagsIcon:J,customTagStyle:Q,onMemberSignUp:W,onPlusMemberAddCart:X,showMemberPrice:I,layoutMode:L,renderDiscountBadge:Y},Z)=>{const[ee,te]=N.useState(!1),[ae,ie]=N.useState(!1),ne=e?.memberDiscountAmount,oe=e?.plusMemberDiscountAmount,se=e?.activityLabels??[],re=P==="guest"?"guest":"member",E=se.find(s=>s.type===re)?.label,le=P==="guest"?b?.memberActivityLabelUnLogin:b?.memberActivityLabel,ce=!!E||!!le,de=e?.discountAmount,o=G[L??"flex"],ue=N.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?Ce:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),F=async(s,d)=>{if(!s)return;const u=d==="primary"?te:ie;u(!0);try{switch(s){case"buyNow":await p?.(e);break;case"addCart":await g?.(e);break;case"learnMore":await h?.(e);break;default:break}}finally{u(!1)}},ge=e.availableForSale&&e.quantityAvailable<=0,me=(s,d)=>{const u=s===0?_?.firstTagVariant:s===1?_?.secondTagVariant:void 0,D=(u||void 0)??(d==="fill"?"fill":d!==void 0?"outline":s===0?"fill":"outline"),f=D==="fill"?{outline:M?.outlineColor,bg:M?.bgColor}:{outline:w?.outlineColor,bg:w?.bgColor},O={...f.outline?{outlineColor:f.outline}:{},...f.bg?{backgroundColor:f.bg,backgroundImage:"none"}:{}};return D==="outline"&&f.outline&&(O.color=f.outline),{variant:D,style:O}},j=!!e.custom_bg_image,be=!!e.custom_scene_image,q=s=>s?{backgroundImage:`url(${s})`,backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat"}:void 0;return l(ye,{ref:Z,className:a("hover:bg-container-secondary-0 bg-container-primary relative flex h-full cursor-pointer flex-col overflow-hidden border-none",o.cardRadius,i,n?.productCard),children:[t(Te,{text:de,style:Q,icon:J,layoutMode:L,renderBadge:Y,className:n?.discountBadge,textClassName:n?.discountBadgeText}),l(pe,{className:a(o.cardContent,"relative flex flex-1 flex-col justify-between"),children:[l("div",{className:"product-image-wrapper group/product-image relative mb-4",children:[j&&t("div",{"aria-hidden":!0,className:a("pointer-events-none absolute inset-0 z-20",o.imageOffset),style:q(e.custom_bg_image)}),be&&t("div",{"aria-hidden":!0,className:a("laptop:block laptop:group-hover/product-image:opacity-100 pointer-events-none absolute inset-0 z-20 hidden opacity-0 transition-opacity duration-300",o.imageOffset),style:q(e.custom_scene_image)}),t("div",{className:a("product-image mx-auto cursor-pointer overflow-hidden",o.image),children:t("a",{onClick:()=>k?.(e),...!k&&{href:e?.listingLink},rel:"noreferrer",className:a("block size-full",j&&"opacity-0"),children:t(U,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"size-full object-contain"})})}),t(xe,{items:e?.socialEndorsements})]}),r&&t("div",{className:"desktop:mb-2 mb-1 flex h-[24px] gap-1",children:e.tags?.map((s,d)=>{if(!s.label)return null;const{variant:u,style:V}=me(d,s.variant);return t(fe,{size:"sm",variant:u,className:"active-shelf-items-tag py-0",style:V,children:s.label},d)})}),l("div",{className:"flex h-full flex-1 grow flex-col justify-between gap-4",children:[l("div",{children:[t(A,{as:"h3",size:"none",className:a("text-info-primary",o.title,n?.productTitle),children:t("a",{onClick:()=>k?.(e),...!k&&{href:e?.listingLink},rel:"noreferrer",className:"hover:text-brand-0 cursor-pointer ",children:e.custom_name||e.name})}),e?.description&&t(C,{size:"none",className:a("active-shelf-product-description text-info-primary",o.description,n?.productDescription),html:e.custom_description||e.description})]}),l("div",{children:[t("div",{className:a(n?.productPrice),children:t("div",{className:a("flex items-baseline",o.priceGap),children:e.availableForSale?l(ke,{children:[t(A,{size:"none",className:a("text-info-primary",o.price),as:"h6",children:e.price}),T?T(e,{showOriginalPrice:x}):x&&e.originalPrice&&t(A,{size:"none",className:a("text-info-tertiary line-through",o.price,n?.originalPrice),as:"h6",children:e.originalPrice})]}):t(A,{size:"none",className:a("text-info-tertiary",o.price),children:b?.outOfStockLabel??"Sold Out"})})}),I&&e?.priceLabel&&e?.availableForSale&&t("div",{className:a("min-h-[1lh]",o.priceLabel),children:t(C,{size:"none",className:a("text-brand-0",n?.productPriceLabel),style:{...R?{color:R}:{}},children:e.priceLabel})}),l("div",{className:a("mt-2 flex",o.buttonContainer,n?.buttonGroup),children:[v&&t($,{variant:"secondary",size:"lg",className:a(o.buttonItem,n?.secondaryButton),onClick:()=>F(S,"secondary"),disabled:!e.availableForSale&&S!=="learnMore",loading:ae,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${v}`,"data-headless-sku":e.sku,children:v}),m&&t($,{variant:"primary",size:"lg",className:a(o.buttonItem,n?.primaryButton),onClick:()=>F(c,"primary"),disabled:!e.availableForSale&&c!=="learnMore",loading:ee,"data-headless-type-name":"ActiveShelf#ProductCard","data-headless-title-desc-button":`${e.custom_name||e.name}#${e.description||""}#${m}`,"data-headless-sku":e.sku,children:m})]}),he(y,B,e?.quantityAvailable??0,e?.totalInventory??0)&&l("div",{className:"mt-4 flex flex-col gap-1",children:[t(ve,{value:ue,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:a("bg-[var(--progress-track-bg,rgba(0,0,0,0.2))]",n?.stockTrack),progressBar:a("bg-brand-0 transition-all duration-300 ease-in-out",n?.stockBar)}}),t(C,{size:3,className:"text-info-tertiary text-[14px]",children:ge?b?.limitedStock:b?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]}),I&&P&&t(Se,{userType:P,copy:b,images:K,onSignUp:W,onPlusMemberAddCart:X,hasActivity:ce,activityLabel:E,memberDiscountAmount:ne,plusMemberDiscountAmount:oe,layoutMode:L})]})});z.displayName="ActiveShelf.ProductCard";var Le=z;export{z as ProductCard,Le as default};