@anker-in/headless-ui 1.3.66-alpha.1788499323979 → 1.3.67
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/biz-components/ActivitySchedule/index.js +1 -1
- package/dist/cjs/biz-components/BrandEquity/BrandEquity.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.js +1 -1
- package/dist/cjs/biz-components/ImageWithText/types.d.ts +2 -2
- package/dist/cjs/biz-components/SecondaryBanner/index.d.ts +0 -10
- package/dist/cjs/biz-components/SecondaryBanner/index.js +1 -1
- package/dist/cjs/biz-components/Specs/dropdown.d.ts +1 -2
- package/dist/cjs/biz-components/Specs/dropdown.js +2 -2
- package/dist/cjs/biz-components/Specs/index.js +1 -1
- package/dist/cjs/components/link.js +1 -1
- package/dist/cjs/helpers/priceFormatting.js +1 -1
- package/dist/cjs/hooks/useDraggableScroll.js +1 -1
- package/dist/cjs/hooks/useExposure.d.ts +1 -1
- package/dist/cjs/hooks/useExposure.js +1 -1
- package/dist/cjs/hooks/useViewItemList.d.ts +1 -1
- package/dist/esm/biz-components/ActivitySchedule/index.js +1 -1
- package/dist/esm/biz-components/BrandEquity/BrandEquity.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/esm/biz-components/ImageWithText/ImageWithText.js +1 -1
- package/dist/esm/biz-components/ImageWithText/types.d.ts +2 -2
- package/dist/esm/biz-components/SecondaryBanner/index.d.ts +0 -10
- package/dist/esm/biz-components/SecondaryBanner/index.js +1 -1
- package/dist/esm/biz-components/Specs/dropdown.d.ts +1 -2
- package/dist/esm/biz-components/Specs/dropdown.js +2 -2
- package/dist/esm/biz-components/Specs/index.js +1 -1
- package/dist/esm/components/link.js +1 -1
- package/dist/esm/helpers/priceFormatting.js +1 -1
- package/dist/esm/hooks/useDraggableScroll.js +1 -1
- package/dist/esm/hooks/useExposure.d.ts +1 -1
- package/dist/esm/hooks/useExposure.js +1 -1
- package/dist/esm/hooks/useViewItemList.d.ts +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var C=Object.create;var p=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var B=(e,t)=>{for(var a in t)p(e,a,{get:t[a],enumerable:!0})},
|
|
1
|
+
"use strict";"use client";var C=Object.create;var p=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty;var B=(e,t)=>{for(var a in t)p(e,a,{get:t[a],enumerable:!0})},g=(e,t,a,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of V(t))!I.call(e,s)&&s!==a&&p(e,s,{get:()=>t[s],enumerable:!(c=P(t,s))||c.enumerable});return e};var L=(e,t,a)=>(a=e!=null?C(z(e)):{},g(t||!e||!e.__esModule?p(a,"default",{value:e,enumerable:!0}):a,e)),E=e=>g(p({},"__esModule",{value:!0}),e);var R={};B(R,{default:()=>M});module.exports=E(R);var i=require("react/jsx-runtime"),v=L(require("react")),d=require("../../helpers/index.js"),l=require("../../components/index.js"),f=require("class-variance-authority"),h=require("swiper/react"),y=require("../../shared/Styles.js");const j=(0,f.cva)("rounded-card laptop:px-6 laptop:py-4 relative flex min-w-0 flex-col justify-between gap-2 overflow-hidden px-4 py-3",{variants:{state:{"active-light":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","active-dark":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","inactive-light":"bg-[#EAEAEC]","inactive-dark":"bg-[#1E2024]"},size:{small:"laptop:h-[160px] h-[120px]",large:"laptop:h-[240px] h-[200px]"}},defaultVariants:{state:"inactive-light",size:"small"}}),m=(0,f.cva)("font-bold leading-[1.2]",{variants:{state:{"active-light":"text-white","active-dark":"text-white","inactive-light":"text-[#080A0F]","inactive-dark":"text-white"}},defaultVariants:{state:"inactive-light"}}),w=v.memo(({item:e,theme:t="light",className:a,size:c})=>{const s=e.isActive||!1,o=`${s?"active":"inactive"}-${t}`;return(0,i.jsx)("div",{className:(0,d.cn)(j({state:o,size:c}),a),"data-ui-component-id":"ActivityScheduleCard",children:(0,i.jsxs)(l.Link,{asChild:!e?.link,href:e?.link,className:"size-full no-underline hover:text-current",children:[(s?e.activeIcon:e.inactiveIcon)&&(0,i.jsx)("div",{className:"laptop:w-[160px] aspect-1 absolute right-0 top-0 z-10 w-[120px]",children:(0,i.jsx)(l.Picture,{source:s?e.activeIcon.url:e.inactiveIcon.url,alt:s?e.activeIcon.alt:e.inactiveIcon.alt,className:"aspect-square"})}),(0,i.jsxs)("div",{className:"relative z-20 flex h-full flex-col justify-between",children:[(0,i.jsx)(l.Heading,{as:"h3",size:3,html:e.title,className:(0,d.cn)(m({state:o}))}),(0,i.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,i.jsx)("div",{className:"flex flex-col justify-end overflow-hidden",children:(0,i.jsx)(l.Heading,{as:"h4",size:2,html:e.subtitle,className:(0,d.cn)(" line-clamp-2",m({state:o}))})}),c==="large"&&e.description&&(0,i.jsx)(l.Text,{html:e.description,className:(0,d.cn)("lg-desktop:text-[18px] desktop:text-[16px] line-clamp-3 text-[14px] leading-[1.4]",m({state:o}))})]})]})]})})});w.displayName="ActivityScheduleCard";const x=v.forwardRef(({classNames:e={},data:t,...a},c)=>{const s=t.theme||"light",o=t.size||"large",r=v.useMemo(()=>t?.scheduleList?.length||2,[t?.scheduleList]),k=v.useMemo(()=>{const n=N=>{switch(N){case"mobile":return{slidesPerView:1.17,spaceBetween:12};case"tablet":return r===2?{slidesPerView:2,spaceBetween:12}:{slidesPerView:2.4,spaceBetween:12};case"laptop":return r===2?{}:r===4?{slidesPerView:3.2,spaceBetween:16}:{slidesPerView:r,spaceBetween:16};case"desktop":return r===2?{slidesPerView:2,spaceBetween:16}:{slidesPerView:r,spaceBetween:16}}},u=n("mobile"),S=n("tablet"),b=n("laptop"),A=n("desktop");return{0:u,768:S,1024:b,1440:A}},[r]);return(0,i.jsx)(l.Container,{ref:c,className:(0,d.cn)(e?.root),childClassName:"overflow-hidden","data-ui-component-id":"ActivitySchedule",...a,children:(0,i.jsx)(h.Swiper,{breakpoints:k,className:"w-full !overflow-visible",children:t.scheduleList.map((n,u)=>(0,i.jsx)(h.SwiperSlide,{children:(0,i.jsx)(w,{item:n,theme:s,size:o,className:e?.card})},"activityScheduleCardItem"+u))})})});x.displayName="ActivitySchedule";var M=(0,y.withLayout)(x);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var j=Object.create;var d=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var H=(e,r)=>{for(var
|
|
1
|
+
"use strict";"use client";var j=Object.create;var d=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var H=(e,r)=>{for(var i in r)d(e,i,{get:r[i],enumerable:!0})},h=(e,r,i,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of L(r))!A.call(e,o)&&o!==i&&d(e,o,{get:()=>r[o],enumerable:!(a=P(r,o))||a.enumerable});return e};var k=(e,r,i)=>(i=e!=null?j(z(e)):{},h(r||!e||!e.__esModule?d(i,"default",{value:e,enumerable:!0}):i,e)),D=e=>h(d({},"__esModule",{value:!0}),e);var F={};H(F,{default:()=>C});module.exports=D(F);var t=require("react/jsx-runtime"),s=require("react"),l=require("../../helpers/utils.js"),y=k(require("../../components/picture.js")),q=require("../../shared/Styles.js"),E=require("react-responsive"),S=require("../../hooks/useExposure.js"),c=require("swiper/react"),p=require("swiper/modules"),M=k(require("../Title/index.js"));const R="copy",Q="store_benefits",$=(e,r)=>{const i=[];for(let a=0;a<e.length;a+=r)i.push(e.slice(a,a+r));return i},N=(0,s.forwardRef)(({data:{items:e=[],itemShape:r,title:i,theme:a},className:o},u)=>{const[x,B]=(0,s.useState)(!1),v=(0,E.useMediaQuery)({query:"(max-width: 768px)"}),b=(0,s.useRef)(null),f=(0,s.useRef)(null);(0,s.useImperativeHandle)(u,()=>f.current),(0,S.useExposure)(f,{componentType:R,componentName:Q}),(0,s.useEffect)(()=>{B(v)},[v]);const T=x?$(e,3):e;return(0,t.jsxs)("div",{ref:f,className:(0,l.cn)("brand-equity-wrapper w-full",{"aiui-dark":a==="dark"},o),children:[i&&(0,t.jsx)(M.default,{data:{title:i}}),x?(0,t.jsxs)(c.Swiper,{className:(0,l.cn)(o),modules:[p.FreeMode,p.Mousewheel,p.Pagination],freeMode:!0,mousewheel:{forceToAxis:!0},pagination:{clickable:!0,el:b.current},breakpoints:{0:{spaceBetween:12}},children:[T?.map((n,m)=>(0,t.jsx)(c.SwiperSlide,{className:"!flex flex-col gap-3",children:Array.isArray(n)&&n?.map((I,g)=>(0,t.jsx)(w,{data:I,itemShape:r,index:g,theme:a},g))},"SwiperSlide"+m)),(0,t.jsx)("div",{ref:b,className:"mt-3 flex justify-center"})]}):(0,t.jsx)("div",{className:(0,l.cn)("grid grid-cols-1 gap-3","tablet:grid-cols-2","laptop:gap-4 laptop:grid-cols-10"),children:e.map((n,m)=>(0,t.jsx)(w,{data:n,itemShape:r,index:m,theme:a},m))})]})}),w=({data:e,itemShape:r,index:i,theme:a})=>(0,t.jsxs)("div",{className:(0,l.cn)("brand-equity-item",`brand-equity-item-${i+1}`,e.containerName?`brand-equity-item--${e.containerName}`:void 0,"bg-container-secondary-1 box-border flex w-full flex-col p-4","desktop:p-6 justify-between","laptop:col-span-3 lg-desktop:p-8","laptop:h-[192px] lg-desktop:h-[240px] h-[160px]",{"laptop:col-span-4":[0,5,6,11].includes(i),"bg-container-primary":a==="dark"},"rounded-box",e.className),children:[(0,t.jsxs)("div",{className:"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3",children:[(0,t.jsx)("h3",{className:"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary text-[14px] font-bold leading-[1.2] tracking-[-0.02em]",children:e.title}),e.type==="avatar"?(0,t.jsx)("div",{className:"flex shrink-0 -space-x-2",children:e?.avatarList?.map((o,u)=>(0,t.jsx)("div",{className:(0,l.cn)("border-container-primary size-[30px] overflow-hidden rounded-full border-2","relative inline-block shrink-0","lg-desktop:size-[36px]"),children:(0,t.jsx)(y.default,{source:o.avatar?.url,alt:o.avatar?.alt,className:"size-full object-cover"})},u))}):(0,t.jsx)("div",{className:"lg-desktop:size-[36px] size-[30px] shrink-0",children:(0,t.jsx)(y.default,{className:"size-full object-cover",source:e.icon?.url,alt:e.icon?.alt,imgClassName:"w-full h-full object-cover"})})]}),(0,t.jsx)("p",{className:"lg-desktop:text-[24px] text-info-primary line-clamp-3 text-[20px] font-bold leading-[1.2] tracking-[-0.04em]",children:e.description})]});N.displayName="BrandEquity";var C=(0,q.withLayout)(N);
|
|
@@ -1 +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"),g=require("../../helpers/utils.js"),U=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:y,onSidebarNavClick:D,onMobileMenuToggle:G,headerId:E,cartCount:L,menuData:z,render:B,componentOverrides:J,...Y}=n,[R,f]=(0,t.useState)(!1),[W,I]=(0,t.useState)(!1),[A,H]=(0,t.useState)(!1),[$,h]=(0,t.useState)(!1),O=(0,t.useRef)(null),M=(0,t.useRef)(null),q=()=>{const N=window.innerWidth||0;h(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&&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 N=0,a=0,d=0;const v=()=>document?.documentElement?.scrollTop||document?.body?.scrollTop||0,k=v();N=k,I(k>300),H(k>30);const K=(0,ie.default)(()=>{const T=v(),F=T-N;H(T>30),F>0?(a=0,d+=F,d>=300&&T>300&&I(!0)):F<0&&(d=0,a+=Math.abs(F),a>=300&&(I(!1),a=0)),N=T},100);return window.addEventListener("scroll",K,{passive:!0}),()=>window.removeEventListener("scroll",K)},[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(N=>N?.blockType===o.HeaderNavigationActionBlockType.Search)?.searchBar?.[0]||{},[i]),j=B?.mobileHeaderNavigation;return(0,e.jsx)(U.default,{buildProps:c,profile:P,isMobile:$,event:u,payloadData:i,onSidebarNavClick:D,onSeriesProductClick:y,cartCount:L,componentOverrides:J,children:(0,e.jsx)("header",{...Y,id:E||"header","data-ui-component-id":"HeaderNavigation",className:m?"relative z-[100] bg-white":(0,g.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,g.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:(0,g.cn)("hidden !bg-white",!$&&"block"),theme:s,onNavItemClick:()=>!m&&H(!0),onPrimaryNavClick:w}),j?(0,e.jsx)(j,{className:(0,g.cn)("block !bg-white",!$&&"hidden"),menuData:z,data:i,onPrimaryNavClick:w}):(0,e.jsx)(ue,{menuData:z,data:i,className:(0,g.cn)("block !bg-white",!$&&"hidden"),onPrimaryNavClick:w,onMobileMenuToggle:G}),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,g.cn)("overflow-y-auto",{}),children:(0,e.jsx)(be.default,{data:Q,keywords:_,isSearching:p,searchResult:x,onSearch:N=>{b?.(N)},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: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:P,onPrimaryNavClick:s}=n,{event:m,profile:x}=(0,U.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]),[y,D]=(0,t.useState)(null),[G,E]=(0,t.useState)([]),L=(0,t.useRef)(null),[z,B]=(0,t.useState)(!1),J=(0,t.useRef)(null),Y=(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,k)=>({groupIndex:d,index:k,open:!1}))))},[w]);const f=(0,t.useMemo)(()=>{let a=null;for(const d of G){for(const v of d)if(v.open){a=v;break}if(a)break}return a},[G]);(0,ae.useScrollLock)(!!f?.open||z);const W=(a,d,v)=>{B(!1);const k=w[d][v];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 K=w?.flat()||[],T=K?.findIndex(F=>F?.id===w[d][v]?.id);a.stopPropagation(),c?.(),s?.(K[T],T),D(k),E(F=>F.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(y)return y?.components?.[0]?.blockType},[y]),$=(0,C.WithSidebar)(he.SidebarDropdown,y),h=(0,C.WithResource)(ve.ResourceSidebarDropdown,y),O=(0,C.WithMulticol)(ye.MulticolDropdown,y),M=(0,C.WithSupports)(Ne.SupportsDropdown,{categoriesItem:y,currentNavItemRef:R.current?.[f?.groupIndex||0]?.[f?.index||0]}),q=(0,t.useMemo)(()=>{switch(H){case o.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)($,{});case o.HeaderNavigationBlockType.Resource:return(0,e.jsx)(h,{});case o.HeaderNavigationBlockType.Supports:return(0,e.jsx)(M,{});case o.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(O,{});default:return null}},[H,y]),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]),N=(0,t.useCallback)(()=>{B(a=>!a)},[]);return(0,t.useEffect)(()=>{if(L?.current){const a=L.current;return a.addEventListener("click",N),()=>{a.removeEventListener("click",N)}}},[N]),(0,te.useGSAP)(()=>{f?.open&&X.gsap.fromTo(Y?.current,{height:0},{height:"auto"})},[f?.open]),(0,e.jsxs)(l.Container,{className:(0,g.cn)("relative h-[92px]",u),children:[(0,e.jsxs)("div",{ref:J,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,k)=>{const K=f?.groupIndex===d&&f?.index===k;return(0,e.jsx)("div",{ref:T=>{R.current[d][k]=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,k),onKeyDown:T=>I(T,d,k),"aria-expanded":K,"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,g.cn)("size-4 opacity-0 transition-opacity duration-500 group-hover:opacity-100",{"rotate-180":f?.groupIndex===d&&f?.index===k,"opacity-100":b&&f?.groupIndex===d&&f?.index===k,invisible:!v?.components?.length||v?.components?.[0]?.blockType===o.HeaderNavigationBlockType.Links})})]}),(0,e.jsx)("div",{className:(0,g.cn)("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":K},P==="dark"?"bg-white":"bg-[#080A0F]"),"aria-hidden":"true"})]})},v.id)})},`groupCategory-${d}`))})]}),(0,e.jsxs)("div",{role:"menu","aria-hidden":!(f?.open&&y),className:(0,g.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 - ${J?.current?.getBoundingClientRect()?.bottom}px)`},children:[(0,e.jsx)("div",{ref:Y,className:(0,g.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,g.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(h=>h?.mobileShow)),[n]),{currentMenu:m,setCurrentMenu:x,subSubCategory:b}=(0,U.useNavContext)(),[p,_]=(0,t.useState)(!1),[w,y]=(0,t.useState)(0),[D,G]=(0,t.useState)(null),E=(0,t.useRef)(null),L=(0,t.useRef)(!1);(0,t.useEffect)(()=>{if(E?.current&&p){const h=E?.current?.getBoundingClientRect();y(window?.innerHeight-(h?.top||0))}u?.({open:p})},[p,u]),(0,t.useEffect)(()=>{if(!p)return;const h=(0,ie.default)(()=>{if(E?.current){const O=E.current.getBoundingClientRect();L.current=!0,y(window?.innerHeight-(O?.top||0))}},100);return window.addEventListener("resize",h),()=>window.removeEventListener("resize",h)},[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}),J=(0,C.WithSidebar)(ke.MobileSidebarMenu,D),Y=(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)(J,{});case o.HeaderNavigationBlockType.Resource:return(0,e.jsx)(Y,{});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),y(0),x&&x(o.HeaderNavigationMenu.Primary)},[_,y,x]),I=(0,t.useMemo)(()=>n?.bar?.actions?.filter(h=>h?.mobileShow&&h?.blockType!==o.HeaderNavigationActionBlockType.Profile),[n]),A=(0,t.useMemo)(()=>n?.bar?.actions?.find(h=>h?.mobileShow&&h?.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),y(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]),$=(0,t.useCallback)((h,O)=>{const M=Array.isArray(s)?Array.isArray(s[h])?s[h][O]:{}:{};G(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,g.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:$,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,g.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,U.useNavContext)(),{locale:P="us"}=(0,oe.useAiuiContext)();return(0,e.jsxs)("div",{className:(0,g.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,g.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,g.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,U.useNavContext)(),{locale:i="us"}=(0,oe.useAiuiContext)();return(0,e.jsx)("a",{href:(0,g.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,U.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,g.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);
|
|
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);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var fe=Object.create;var S=Object.defineProperty;var he=Object.getOwnPropertyDescriptor;var ge=Object.getOwnPropertyNames;var ve=Object.getPrototypeOf,be=Object.prototype.hasOwnProperty;var we=(n,c)=>{for(var g in c)S(n,g,{get:c[g],enumerable:!0})},U=(n,c,g,b)=>{if(c&&typeof c=="object"||typeof c=="function")for(let v of ge(c))!be.call(n,v)&&v!==g&&S(n,v,{get:()=>c[v],enumerable:!(b=he(c,v))||b.enumerable});return n};var _e=(n,c,g)=>(g=n!=null?fe(ve(n)):{},U(c||!n||!n.__esModule?S(g,"default",{value:n,enumerable:!0}):g,n)),ye=n=>U(S({},"__esModule",{value:!0}),n);var Ie={};we(Ie,{default:()=>Te});module.exports=ye(Ie);var e=require("react/jsx-runtime"),i=_e(require("react")),r=require("../../components/index.js"),o=require("../../helpers/utils.js"),ee=require("../../shared/Styles.js"),te=require("../../hooks/useExposure.js"),ie=require("../../hooks/useIntersectionObserver.js"),ae=require("../AiuiProvider/index.js"),k=require("framer-motion");const ke="image",Ne="image_with_text",X=(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),Y=i.default.forwardRef(({data:n,className:c},g)=>{const{title:b,subtitle:v,desc:_,descIcon:M,image:N,padImage:z,mobileImage:E,theme:oe="dark",items:H=[],layout:le="left",mediaType:se="image",datalist:d=[],video:j,padVideo:R,mobVideo:W,button:w,textAlign:m="left",titleTag:re}=n,l=le,{locale:C="us"}=(0,ae.useAiuiContext)(),D=(0,i.useRef)(null),I=(0,i.useRef)(null),L=(0,i.useRef)(null),P=(0,i.useRef)(null),A=(0,i.useRef)(null),[u,ne]=(0,i.useState)(0),q=(0,i.useRef)([]),[$,me]=(0,i.useState)({left:0,width:0}),[y,B]=(0,i.useState)(""),[F,O]=(0,i.useState)(""),[Z,G]=(0,i.useState)(""),p=d.length>0,T=se==="video";(0,te.useExposure)(D,{componentType:ke,componentName:Ne,componentTitle:b,componentDescription:v}),(0,i.useImperativeHandle)(g,()=>D.current),(0,i.useEffect)(()=>{if(d.length>0){const t=q.current[u];if(t){const{offsetLeft:s,offsetWidth:a}=t;me({left:s,width:a})}}},[u,d.length]);const[J,de]=(0,i.useState)(!1);(0,ie.useIntersectionObserverDelay)(A,{once:!0,threshold:.01,callback:()=>{de(!0)}}),(0,i.useEffect)(()=>{if(!J||!T)return;let t="",s="",a="";if(p&&d[u]){const f=d[u];t=f.video?.url||"",s=f.padVideo?.url||t,a=f.mobVideo?.url||t}else t=j?.url||"",s=R?.url||t,a=W?.url||t;t&&B(t),s&&O(s),a&&G(a),setTimeout(()=>{[I.current?.querySelector("video"),L.current?.querySelector("video"),P.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},200)},[J,T,p,u,d,j?.url,R?.url,W?.url]);const ce=(t,s)=>{if(ne(t),s.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),T&&p&&d[t]){const a=d[t];a.video?.url&&B(a.video.url),a.padVideo?.url&&O(a.padVideo.url),a.mobVideo?.url&&G(a.mobVideo.url),setTimeout(()=>{[I.current?.querySelector("video"),L.current?.querySelector("video"),P.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},300)}},pe=()=>!V||!w?.text||l==="bottom"?null:(0,e.jsx)("div",{className:(0,o.cn)("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":m==="center","flex justify-start":m==="left"}),children:(0,e.jsx)(r.Link,{href:(0,o.getLocalizedPath)(w.link||"",C),className:"image-with-text__button whitespace-nowrap no-underline",suffixIcon:X,children:w.text})}),x=H.length>0,V=!!w,K=()=>{if(p&&d[u]){const t=d[u];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return N?`${N?.url},${z?.url||N?.url} 1024, ${E?.url||N?.url} 768`:""},Q=()=>{if(p){const f=d[u],h=f.image?.url,xe=f.imgPad?.url||h,ue=f.imageMob?.url||h;return(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:I,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:h,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:L,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:xe,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:P,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:ue,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},f.video?.url||f.image?.url)})}const t=N?.url,s=z?.url||t,a=E?.url||t;return(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:I,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:L,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:s,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:P,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:a,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return(0,e.jsxs)("section",{ref:D,"data-ui-component-id":"ImageWithText",className:(0,o.cn)("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!p,"flex-col":!p&&l==="bottom","items-center":l==="left"||l==="right","flex-col laptop:flex-row":!p&&(l==="left"||l==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":p,"aiui-dark":oe==="dark"},c),children:[p&&(b||_||d.length>0)&&(0,e.jsxs)("div",{className:(0,o.cn)("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":m==="left","text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:"image-with-text__header",children:[(0,e.jsx)(r.Heading,{as:"h3",size:4,html:b,className:"image-with-text__title"}),(0,e.jsx)(r.Text,{as:"p",size:1,html:_,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),(0,e.jsx)("div",{className:(0,o.cn)("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":m==="center"}),children:(0,e.jsxs)("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[(0,e.jsx)("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:$.left,width:$.width}}),d.map((t,s)=>(0,e.jsx)("div",{ref:a=>{q.current[s]=a},onClick:a=>ce(s,a),className:(0,o.cn)("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",u===s?"image-with-text__tab--active text-black":"text-white"),children:(0,e.jsx)(r.Heading,{as:re??"h3",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},s))]})})]}),!p&&(b||v||_)&&(0,e.jsxs)("div",{className:(0,o.cn)("image-with-text__content flex w-full flex-col",{"justify-center":!V,"justify-between":V,"items-start":m==="left"&&x,"items-center":m==="center"&&x,"text-left":m==="left","text-center":m==="center","laptop:order-1":l==="left"}),children:[(0,e.jsxs)("div",{className:(0,o.cn)("image-with-text__main-content",{"flex flex-col":V}),children:[(0,e.jsxs)("div",{className:(0,o.cn)("image-with-text__header",{"laptop:flex laptop:items-end laptop:justify-between laptop:gap-16":l==="bottom"&&w?.text}),children:[(0,e.jsxs)("div",{className:"image-with-text__title-wrapper flex min-w-0 flex-1 flex-col",children:[(0,e.jsx)(r.Heading,{as:"h2",size:4,html:b,className:(0,o.cn)("image-with-text__title",{"text-left":x&&m==="left","text-center":x&&m==="center"})}),v&&(0,e.jsx)(r.Text,{as:"p",size:x?4:3,html:v,className:(0,o.cn)("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!x,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":x,"text-left":x&&m==="left","text-center":x&&m==="center"})})]}),l==="bottom"&&w?.text&&(0,e.jsx)(r.Link,{href:(0,o.getLocalizedPath)(w.link||"",C),className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:X,children:w.text})]}),!x&&(_||M)&&(0,e.jsxs)("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[M&&(0,e.jsx)("img",{src:M,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),_&&(0,e.jsx)(r.Heading,{as:"h4",size:5,html:_,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),x&&(0,e.jsx)("div",{className:(0,o.cn)("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":l==="bottom","grid-cols-2 tablet:grid-cols-4":l==="bottom","grid-cols-2 tablet:grid-cols-4 laptop:grid-cols-2":l==="left"||l==="right"}),children:H.map((t,s)=>(0,e.jsxs)("div",{className:(0,o.cn)("image-with-text__item",{"text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:(0,o.cn)("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":m==="center","justify-start":m==="left"}),children:[t.icon?.url&&(0,e.jsx)(r.Picture,{source:t.icon.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),(0,e.jsx)(r.Heading,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),(0,e.jsx)(r.Text,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},s))})]}),pe()]}),(0,e.jsx)("div",{ref:A,className:(0,o.cn)("image-with-text__media-wrapper",{"laptop:w-[60%] w-full shrink-0":l==="left"||l==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":x,"laptop:basis-[63%] desktop:basis-[57%]":x&&l==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":p,"!max-w-none !max-h-none aspect-auto":l==="bottom"}),children:p?T?Q():(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:(0,e.jsx)(r.Picture,{source:K(),alt:d[u].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},d[u].image?.url)}):T?Q():(0,e.jsx)(r.Picture,{source:K(),className:(0,o.cn)("image-with-text__image rounded-box laptop:rounded-box")})})]})});Y.displayName="ImageWithText";var Te=(0,ee.withLayout)(Y);
|
|
1
|
+
"use strict";"use client";var fe=Object.create;var S=Object.defineProperty;var he=Object.getOwnPropertyDescriptor;var ge=Object.getOwnPropertyNames;var ve=Object.getPrototypeOf,be=Object.prototype.hasOwnProperty;var we=(n,p)=>{for(var g in p)S(n,g,{get:p[g],enumerable:!0})},U=(n,p,g,b)=>{if(p&&typeof p=="object"||typeof p=="function")for(let v of ge(p))!be.call(n,v)&&v!==g&&S(n,v,{get:()=>p[v],enumerable:!(b=he(p,v))||b.enumerable});return n};var _e=(n,p,g)=>(g=n!=null?fe(ve(n)):{},U(p||!n||!n.__esModule?S(g,"default",{value:n,enumerable:!0}):g,n)),ye=n=>U(S({},"__esModule",{value:!0}),n);var Ie={};we(Ie,{default:()=>Te});module.exports=ye(Ie);var e=require("react/jsx-runtime"),a=_e(require("react")),r=require("../../components/index.js"),l=require("../../helpers/utils.js"),ee=require("../../shared/Styles.js"),te=require("../../hooks/useExposure.js"),ie=require("../../hooks/useIntersectionObserver.js"),ae=require("../AiuiProvider/index.js"),k=require("framer-motion");const ke="image",Ne="image_with_text",X=(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:(0,e.jsx)("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),Y=a.default.forwardRef(({data:n,className:p},g)=>{const{title:b,subtitle:v,desc:_,descIcon:M,image:N,padImage:z,mobileImage:E,theme:oe="dark",items:H=[],layout:le="left",mediaType:se="image",datalist:d=[],video:j,padVideo:R,mobVideo:W,button:w,textAlign:m="left",titleTag:re}=n,i=le,{locale:C="us"}=(0,ae.useAiuiContext)(),D=(0,a.useRef)(null),I=(0,a.useRef)(null),L=(0,a.useRef)(null),P=(0,a.useRef)(null),A=(0,a.useRef)(null),[u,ne]=(0,a.useState)(0),q=(0,a.useRef)([]),[$,me]=(0,a.useState)({left:0,width:0}),[y,B]=(0,a.useState)(""),[F,O]=(0,a.useState)(""),[Z,G]=(0,a.useState)(""),c=d.length>0,T=se==="video";(0,te.useExposure)(D,{componentType:ke,componentName:Ne,componentTitle:b,componentDescription:v}),(0,a.useImperativeHandle)(g,()=>D.current),(0,a.useEffect)(()=>{if(d.length>0){const t=q.current[u];if(t){const{offsetLeft:s,offsetWidth:o}=t;me({left:s,width:o})}}},[u,d.length]);const[J,de]=(0,a.useState)(!1);(0,ie.useIntersectionObserverDelay)(A,{once:!0,threshold:.01,callback:()=>{de(!0)}}),(0,a.useEffect)(()=>{if(!J||!T)return;let t="",s="",o="";if(c&&d[u]){const f=d[u];t=f.video?.url||"",s=f.padVideo?.url||t,o=f.mobVideo?.url||t}else t=j?.url||"",s=R?.url||t,o=W?.url||t;t&&B(t),s&&O(s),o&&G(o),setTimeout(()=>{[I.current?.querySelector("video"),L.current?.querySelector("video"),P.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},200)},[J,T,c,u,d,j?.url,R?.url,W?.url]);const pe=(t,s)=>{if(ne(t),s.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),T&&c&&d[t]){const o=d[t];o.video?.url&&B(o.video.url),o.padVideo?.url&&O(o.padVideo.url),o.mobVideo?.url&&G(o.mobVideo.url),setTimeout(()=>{[I.current?.querySelector("video"),L.current?.querySelector("video"),P.current?.querySelector("video")].forEach(h=>{h&&(h.load(),h.play().catch(()=>{}))})},300)}},ce=()=>!V||!w?.text||i==="top"||i==="bottom"?null:(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":m==="center","flex justify-start":m==="left"}),children:(0,e.jsx)(r.Link,{href:(0,l.getLocalizedPath)(w.link||"",C),className:"image-with-text__button whitespace-nowrap no-underline",suffixIcon:X,children:w.text})}),x=H.length>0,V=!!w,K=()=>{if(c&&d[u]){const t=d[u];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return N?`${N?.url},${z?.url||N?.url} 1024, ${E?.url||N?.url} 768`:""},Q=()=>{if(c){const f=d[u],h=f.image?.url,xe=f.imgPad?.url||h,ue=f.imageMob?.url||h;return(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:I,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:h,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:L,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:xe,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:P,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:ue,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},f.video?.url||f.image?.url)})}const t=N?.url,s=z?.url||t,o=E?.url||t;return(0,e.jsxs)("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[(0,e.jsx)("div",{ref:I,className:"image-with-text__desktop-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:y,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),(0,e.jsx)("div",{ref:L,className:"image-with-text__tablet-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:s,src:F||y,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),(0,e.jsx)("div",{ref:P,className:"image-with-text__mobile-video-container",children:(0,e.jsx)("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:o,src:Z||y,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return(0,e.jsxs)("section",{ref:D,"data-ui-component-id":"ImageWithText",className:(0,l.cn)("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!c,"flex-col":!c&&(i==="top"||i==="bottom"),"items-center":i==="left"||i==="right","flex-col laptop:flex-row":!c&&(i==="left"||i==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":c,"aiui-dark":oe==="dark"},p),children:[c&&(b||_||d.length>0)&&(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":m==="left","text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:"image-with-text__header",children:[(0,e.jsx)(r.Heading,{as:"h3",size:4,html:b,className:"image-with-text__title"}),(0,e.jsx)(r.Text,{as:"p",size:1,html:_,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":m==="center"}),children:(0,e.jsxs)("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[(0,e.jsx)("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:$.left,width:$.width}}),d.map((t,s)=>(0,e.jsx)("div",{ref:o=>{q.current[s]=o},onClick:o=>pe(s,o),className:(0,l.cn)("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",u===s?"image-with-text__tab--active text-black":"text-white"),children:(0,e.jsx)(r.Heading,{as:re??"h3",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},s))]})})]}),!c&&(b||v||_)&&(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__content flex w-full flex-col",{"justify-center":!V,"justify-between":V,"items-start":m==="left"&&x,"items-center":m==="center"&&x,"text-left":m==="left","text-center":m==="center","laptop:order-1":i==="left"}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__main-content",{"flex flex-col":V}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__header",{"laptop:flex laptop:items-end laptop:justify-between laptop:gap-16":(i==="top"||i==="bottom")&&w?.text}),children:[(0,e.jsxs)("div",{className:"image-with-text__title-wrapper flex min-w-0 flex-1 flex-col",children:[(0,e.jsx)(r.Heading,{as:"h2",size:4,html:b,className:(0,l.cn)("image-with-text__title",{"text-left":x&&m==="left","text-center":x&&m==="center"})}),v&&(0,e.jsx)(r.Text,{as:"p",size:x?4:3,html:v,className:(0,l.cn)("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!x,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":x,"text-left":x&&m==="left","text-center":x&&m==="center"})})]}),(i==="top"||i==="bottom")&&w?.text&&(0,e.jsx)(r.Link,{href:(0,l.getLocalizedPath)(w.link||"",C),className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:X,children:w.text})]}),!x&&(_||M)&&(0,e.jsxs)("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[M&&(0,e.jsx)("img",{src:M,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),_&&(0,e.jsx)(r.Heading,{as:"h4",size:5,html:_,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),x&&(0,e.jsx)("div",{className:(0,l.cn)("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4 laptop:grid-cols-2":i==="left"||i==="right"}),children:H.map((t,s)=>(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__item",{"text-center":m==="center"}),children:[(0,e.jsxs)("div",{className:(0,l.cn)("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":m==="center","justify-start":m==="left"}),children:[t.icon?.url&&(0,e.jsx)(r.Picture,{source:t.icon.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),(0,e.jsx)(r.Heading,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),(0,e.jsx)(r.Text,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},s))})]}),ce()]}),(0,e.jsx)("div",{ref:A,className:(0,l.cn)("image-with-text__media-wrapper",{"laptop:w-[60%] w-full shrink-0":i==="left"||i==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":x,"laptop:basis-[63%] desktop:basis-[57%]":x&&i==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":c,"!max-w-none !max-h-none aspect-auto":i==="top"||i==="bottom"}),children:c?T?Q():(0,e.jsx)(k.AnimatePresence,{mode:"wait",children:(0,e.jsx)(k.motion.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:(0,e.jsx)(r.Picture,{source:K(),alt:d[u].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},d[u].image?.url)}):T?Q():(0,e.jsx)(r.Picture,{source:K(),className:(0,l.cn)("image-with-text__image rounded-box laptop:rounded-box")})})]})});Y.displayName="ImageWithText";var Te=(0,ee.withLayout)(Y);
|
|
@@ -45,7 +45,7 @@ export interface ImageWithTextTabItem {
|
|
|
45
45
|
title: string;
|
|
46
46
|
}
|
|
47
47
|
export type MediaType = 'image' | 'video';
|
|
48
|
-
export type LayoutPosition = 'left' | 'right' | 'bottom';
|
|
48
|
+
export type LayoutPosition = 'left' | 'right' | 'top' | 'bottom';
|
|
49
49
|
export type TextAlign = 'left' | 'center';
|
|
50
50
|
/** 列数枚举类型 */
|
|
51
51
|
export declare enum Cols {
|
|
@@ -68,7 +68,7 @@ export interface ImageWithTextProps {
|
|
|
68
68
|
descIcon?: string;
|
|
69
69
|
/** 主题，默认 dark */
|
|
70
70
|
theme?: Theme;
|
|
71
|
-
/** 布局位置，默认 left
|
|
71
|
+
/** 布局位置，默认 left。支持上下左右布局（left/right/top/bottom） */
|
|
72
72
|
layout?: LayoutPosition;
|
|
73
73
|
/** 媒体类型，默认 image。所有模式都支持 image 和 video */
|
|
74
74
|
mediaType?: MediaType;
|
|
@@ -24,11 +24,6 @@ export interface SecondaryBannerCarouselConfig {
|
|
|
24
24
|
export interface SecondaryBannerSlideData {
|
|
25
25
|
title?: string;
|
|
26
26
|
titleTag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
27
|
-
/**
|
|
28
|
-
* 是否将主标题渲染为 `<p>` 标签。为 true 时使用 Text 组件渲染，样式与 Heading 保持一致。
|
|
29
|
-
* @default false
|
|
30
|
-
*/
|
|
31
|
-
titleAsParagraph?: boolean;
|
|
32
27
|
superTitle?: string;
|
|
33
28
|
subtitle?: string;
|
|
34
29
|
size?: 'sm' | 'base' | 'lg' | 'xlg';
|
|
@@ -83,11 +78,6 @@ export interface SecondaryBannerData {
|
|
|
83
78
|
* @default 'h2'
|
|
84
79
|
*/
|
|
85
80
|
titleTag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
86
|
-
/**
|
|
87
|
-
* 是否将主标题渲染为 `<p>` 标签。为 true 时使用 Text 组件渲染，样式与 Heading 保持一致。
|
|
88
|
-
* @default false
|
|
89
|
-
*/
|
|
90
|
-
titleAsParagraph?: boolean;
|
|
91
81
|
/**
|
|
92
82
|
* 上标题/引导标题
|
|
93
83
|
* 通常用于分类、引导性文字
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var Q=Object.create;var u=Object.defineProperty;var U=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames;var Y=Object.getPrototypeOf,Z=Object.prototype.hasOwnProperty;var ee=(n,t)=>{for(var e in t)u(n,e,{get:t[e],enumerable:!0})},z=(n,t,e,m)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of X(t))!Z.call(n,p)&&p!==e&&u(n,p,{get:()=>t[p],enumerable:!(m=U(t,p))||m.enumerable});return n};var g=(n,t,e)=>(e=n!=null?Q(Y(n)):{},z(t||!n||!n.__esModule?u(e,"default",{value:n,enumerable:!0}):e,n)),te=n=>z(u({},"__esModule",{value:!0}),n);var ne={};ee(ne,{default:()=>ae,secondaryBannerVariants:()=>P});module.exports=te(ne);var a=require("react/jsx-runtime"),C=g(require("react")),D=require("class-variance-authority"),x=g(require("jump.js")),o=require("../../helpers/index.js"),i=require("../../components/index.js"),N=require("../../shared/Styles.js"),L=g(require("../Media/index.js")),A=require("../AiuiProvider/index.js"),O=g(require("./SecondaryBannerCarousel.js"));const P=(0,D.cva)("text-info-primary relative w-full",{variants:{size:{sm:"tablet:aspect-[768/480] laptop:aspect-[1920/480] desktop:aspect-[1920/480] lg-desktop:aspect-[1920/480] aspect-[390/480]",base:"tablet:aspect-[768/660] laptop:aspect-[1920/720] desktop:aspect-[1920/720] lg-desktop:aspect-[1920/720] aspect-[390/660]",lg:"tablet:aspect-[768/660] laptop:aspect-[1920/930] desktop:aspect-[1920/930] lg-desktop:aspect-[1920/930] aspect-[390/660]",xlg:"tablet:aspect-[768/660] laptop:aspect-[1920/930] desktop:aspect-[1920/930] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible"}},defaultVariants:{size:"base"}}),M=C.forwardRef(({className:n,classNames:t={},data:e,jumpOptions:m={},isActive:p,...h},k)=>{const{pcImage:w,padImage:_,mobileImage:j,isVideoLoop:H,endDate:B,endDate_tz:V,dateFormat:E,size:J,iconArray:b,theme:R,primaryButton:s,secondaryButton:r,title:F,titleTag:W}=e,$=H??!0,y=J??"base",q=R??"light",G=W??"h2",{locale:T="us"}=(0,A.useAiuiContext)(),v={...{duration:500,offset:0},...m},f=C.useId(),d=F?`${f}-title`:void 0,I=e.subtitle?`${f}-subtitle`:void 0,S=e.superTitle?`${f}-super-title`:void 0,K=[S,I].filter(Boolean).join(" ")||void 0;return e.mode==="carousel"&&e.items&&e.items.length>0?(0,a.jsx)(O.default,{data:e,className:n,classNames:t,jumpOptions:m,ref:k,...h}):(0,a.jsxs)("section",{ref:k,role:"banner","aria-labelledby":d,"aria-describedby":K,className:(0,o.cn)({"aiui-dark":q==="dark"},P({size:y}),n,t?.root),...h,children:[(0,a.jsx)("div",{className:(0,o.cn)("absolute inset-0",{"h-fit":y==="xlg"}),children:(0,a.jsx)(L.default,{pcImage:w,padImage:_,mobileImage:j,className:"size-full",imgClassName:"object-cover",videoClassName:"object-cover",muted:!0,loop:$,playsInline:!0,autoPlay:p??!0})}),(0,a.jsxs)("div",{className:(0,o.cn)("banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center px-[16px] text-left",t?.content),children:[(0,a.jsxs)("div",{className:"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1",children:[e.superTitle&&(0,a.jsx)(i.Text,{as:"p",size:2,id:S,className:(0,o.cn)("banner-super-title desktop:text-[16px] lg-desktop:text-[18px]",t?.superTitle),html:e.superTitle}),e.title&&(0,a.jsx)(i.Heading,{as:G,size:["xlg","lg"].includes(y)?5:4,id:d,className:(0,o.cn)("banner-title ",t?.title),html:e.title}),e.subtitle&&(0,a.jsx)(i.Text,{as:"p",size:3,id:I,className:(0,o.cn)("banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]",t?.subtitle),html:e.subtitle})]}),B&&(0,a.jsx)("div",{className:"banner-countdown",children:(0,a.jsx)(i.Countdown,{endDate:B,endDate_tz:V,dateFormat:E,variant:"spacious",className:"lg-desktop:mt-8 mt-6"})}),(0,a.jsxs)("div",{className:(0,o.cn)("banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2",t?.buttonGroup),children:[r?.text&&(0,a.jsx)(i.Button,{variant:"secondary",onClick:c=>{if(r.link?.startsWith("#")){c.preventDefault();const l=document.querySelector(r.link);l&&(0,x.default)(l,v)}r.onClick?.()},className:(0,o.cn)("",t?.secondaryButton),"aria-describedby":d,...r.link&&!r.link.startsWith("#")?{as:"a",href:(0,o.getLocalizedPath)(r.link,T)}:{},children:r.text}),s?.text&&(0,a.jsx)(i.Button,{onClick:c=>{if(s.link?.startsWith("#")){c.preventDefault();const l=document.querySelector(s.link);l&&(0,x.default)(l,v)}s.onClick?.()},className:(0,o.cn)("",t?.primaryButton),"aria-describedby":d,...s.link&&!s.link.startsWith("#")?{as:"a",href:(0,o.getLocalizedPath)(s.link,T)}:{},children:s.text})]}),Array.isArray(b)&&b.length>0&&(0,a.jsx)("div",{className:"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2",role:"group","aria-label":"brand icons",children:b.map((c,l)=>c.pcImage?(0,a.jsx)(i.Picture,{source:c.pcImage.url,alt:c.pcImage.alt||`icon ${l+1}`,role:"img",className:"laptop:h-auto h-[48px] max-w-none",imgClassName:"h-full"},l):null)})]})]})});M.displayName="SecondaryBanner";var ae=(0,N.withLayout)(M);
|
|
@@ -5,7 +5,6 @@ export type DropDownProps = {
|
|
|
5
5
|
setActive: any;
|
|
6
6
|
setVisible: any;
|
|
7
7
|
visible: any;
|
|
8
|
-
resolveName?: (item: any, sku?: string) => string;
|
|
9
8
|
};
|
|
10
|
-
declare const DropDown: ({ index, active, list, setActive, setVisible, visible
|
|
9
|
+
declare const DropDown: ({ index, active, list, setActive, setVisible, visible }: DropDownProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
10
|
export default DropDown;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
2
|
-
${
|
|
1
|
+
"use strict";var i=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var D=(n,o)=>{for(var r in o)i(n,r,{get:o[r],enumerable:!0})},h=(n,o,r,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let t of b(o))!v.call(n,t)&&t!==r&&i(n,t,{get:()=>o[t],enumerable:!(l=f(o,t))||l.enumerable});return n};var x=n=>h(i({},"__esModule",{value:!0}),n);var y={};D(y,{default:()=>w});module.exports=x(y);var s=require("react/jsx-runtime"),c=require("react");const k="openDropDown",m=({index:n,active:o,list:r,setActive:l,setVisible:t,visible:d})=>{const p=(0,c.useRef)(null);return(0,c.useEffect)(()=>{const e=a=>{const u=a?.target?.getAttribute?.("class");!p?.current?.contains(a?.target)&&!u?.includes(k)&&t({...d,[n]:!1})};return document.addEventListener("click",e),()=>document.removeEventListener("click",e)},[]),(0,s.jsx)("div",{ref:p,className:`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-white ${d?.[n]?"block":"hidden"}`,children:(0,s.jsx)("div",{className:"m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0",children:r?.map((e,a)=>{const u=e?.sku||e?.variants?.[0]?.sku;return(0,s.jsx)("div",{onClick:()=>{l({...o,[n]:{sku:u,name:e?.name||e?.title,handle:e?.handle}}),t({...d,[n]:!1})},title:e?.name||e?.title,className:`openDropDown min-xl:text-lg min-xxl:text-lg box-border cursor-pointer truncate px-6 py-4 text-base font-bold [&:hover]:bg-[#EAEAEC]
|
|
2
|
+
${e?.handle===o?.handle?"bg-[#EAEAEC]":""}`,children:e?.name||e?.title},a)})})})};var w=m;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var te=Object.create;var k=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var ne=Object.getOwnPropertyNames;var oe=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var le=(a,o)=>{for(var d in o)k(a,d,{get:o[d],enumerable:!0})},j=(a,o,d,w)=>{if(o&&typeof o=="object"||typeof o=="function")for(let f of ne(o))!ae.call(a,f)&&f!==d&&k(a,f,{get:()=>o[f],enumerable:!(w=se(o,f))||w.enumerable});return a};var H=(a,o,d)=>(d=a!=null?te(oe(a)):{},j(o||!a||!a.__esModule?k(d,"default",{value:a,enumerable:!0}):d,a)),re=a=>j(k({},"__esModule",{value:!0}),a);var ce={};le(ce,{default:()=>ie});module.exports=re(ce);var e=require("react/jsx-runtime"),R=H(require("./dropdown.js")),I=require("../AiuiProvider/index.js"),_=require("react-responsive"),u=require("react"),$=require("../../shared/Styles.js"),O=require("../ShelfDisplay/shelfDisplay.js"),r=require("../../components/index.js"),U=require("../../helpers/index.js"),b=H(require("react"));const P=b.default.forwardRef(({data:a,buildData:o,onChange:d,onSecondaryChange:w,className:f,...V},B)=>{const g=(0,_.useMediaQuery)({query:"(max-width: 768px)"}),[p,N]=(0,u.useState)({}),[S,z]=(0,u.useState)([]),[M,D]=(0,u.useState)(!1),[C,E]=(0,u.useState)({}),A=(0,b.useRef)(null),{locale:q="us",currencyDisplay:Q,trackingData:W,currencyCode:G}=(0,I.useAiuiContext)(),J=W?.showComparePrice??!0,{LeftMenu:T,RightMenu:L,DefaultSelectMenu:v}=(0,u.useMemo)(()=>a?.data||{},[a?.data]),K=t=>{try{const n=new URL(t).pathname.toLowerCase();return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(n)}catch{return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(t)}},X=(t,s)=>{const n=t?.variants?.find?.(m=>m?.sku===t?.sku),l=n?.coupons?.[0],{price:i,basePrice:c}=(0,O.formatVariantPrice)({locale:G==="CAD"?"us":q||"us",amount:l?l?.variant_price4wscode:n?.price,baseAmount:l?n?.price:0,currencyDisplay:Q,currencyCode:t?.price?.currencyCode||"USD"}),x=typeof v?.buttonText=="string"?v?.buttonText:v?.buttonText?.[String(s)]||"";return(0,e.jsxs)("div",{className:"specs-sku-node-wrap box-border",children:[(0,e.jsxs)(r.Text,{className:"md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold",onClick:()=>{if(S?.length<=1)return null;E({...C,[s]:!C?.[s]})},children:[(0,e.jsxs)("div",{className:"flex items-center justify-between overflow-hidden",children:[(0,e.jsx)("div",{className:"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base",title:p?.[s]?.name||"",children:p?.[s]?.name||""}),S?.length>1?(0,e.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"25",viewBox:"0 0 24 25",fill:"none",className:"openDropDown",children:(0,e.jsx)("path",{d:"M6 9.5L12 15.5L18 9.5",stroke:"#1D1D1F",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}):null]}),(0,e.jsx)(R.default,{index:s,list:S,active:p,setActive:N,visible:C,setVisible:E})]}),(0,e.jsx)("div",{className:"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]",children:(0,e.jsx)(r.Picture,{source:n?.image?.url||"",className:"aspect-h-[280] aspect-w-[280]",imgClassName:"w-full h-full object-cover hover:scale-105 transition-all duration-300"})}),(0,e.jsx)("div",{className:"lg-desktop:text-2xl mb-2 mt-6 text-xl font-bold",children:(0,e.jsx)("div",{className:"lg-desktop:min-h-[32px] flex min-h-[28px] items-center",children:n?.availableForSale?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:"specs-sku-node-price text-[#080A0F]",children:i||""}),J&&c&&(0,e.jsx)("div",{className:"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through",children:c})]}):null})}),x?(0,e.jsx)(r.Button,{onClick:()=>{d?.(t,s)},className:"specs-sku-node-button",children:x}):null]})},Y=t=>t&&typeof t!="string"?(0,e.jsxs)("div",{className:"size-full",children:[(0,e.jsx)("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:t?.text||""}}),(0,e.jsx)(r.Picture,{source:t?.imgUrl,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"})]}):(0,e.jsx)("div",{className:"break-all",children:K(t)?(0,e.jsx)(r.Picture,{source:t,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"}):(0,e.jsx)("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:t||""}})}),F=t=>t.map((s,n)=>{const l=n===0;return(0,e.jsxs)("div",{className:"l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] specs-product-node-wrap",children:[(0,e.jsx)(r.Heading,{as:"h3",html:s||"",className:"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm"}),(0,e.jsx)("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${M?3:2} specs-product-node-body col-span-2 grid flex-1 py-6`,children:Object.keys(p)?.map?.(i=>{const c=p?.[i],x=L?.menus?.find?.(m=>m?.handle===c?.handle)?.subTitle;return Y(x?.[s])})})]},s)}),Z=t=>{if(!p)return;const{subTitle:s,isProduct:n}=t;return n?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("div",{className:"l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]",children:[t?.title&&(0,e.jsx)(r.Heading,{as:"h3",html:t?.title||"",className:"l:hidden specs-item-product-title"}),(0,e.jsx)("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${M?3:2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`,children:Object.keys(p)?.map((l,i)=>{const c=p?.[l],x=o?.products?.find?.(m=>m?.handle===c?.handle);return(0,e.jsx)("div",{children:X({...x,item:l,sku:c?.sku},i)},l)})})]}),t?.categoryLabel&&(0,e.jsx)(r.Heading,{size:2,as:"h4",html:t?.categoryLabel||"",className:"desktop:p-6 specs-item-product-category py-6"}),s?.length?F(s):null]}):F(s)};return(0,b.useImperativeHandle)(B,()=>A.current),(0,u.useEffect)(()=>{if(!o?.products?.length)return;const t=v?.sku?.split?.(",")||[],s=g&&t?.length>2?t?.slice(0,2):t;let n={};s?.forEach?.((i,c)=>{const m=L?.menus?.find?.(h=>h?.sku===i)?.handle,y=m?o?.products?.find?.(h=>h?.handle===m):o?.products?.find?.(h=>{if(h?.variants?.find?.(ee=>ee?.sku===i))return!0});y&&(n={...n,[c]:{sku:i,name:y?.name||y?.title,handle:m||y?.handle}})});const l=o?.products?.filter(i=>L?.menus?.find(c=>c?.handle===i?.handle));N(n),z(l),D(t?.length>2&&!g)},[o,g]),(0,u.useEffect)(()=>{if(g){const t=Object.keys(p||{});if(t?.length>2){const s=t?.slice?.(0,2);let n={};s?.forEach?.(l=>{n={...n,[l]:p?.[l]}}),D(!1),N(n)}}},[g]),(0,e.jsx)("div",{...V,className:(0,U.cn)("specs-wrapper w-full overflow-hidden bg-[#F5F5F7]",f),ref:A,children:T?.data?(0,e.jsx)("div",{className:"specs-wrapper-content box-border w-full overflow-hidden",children:T?.data?.map?.((t,s)=>(0,e.jsx)("div",{className:"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0",children:Z(t)},s))}):null})});P.displayName="Specs";var ie=(0,$.withLayout)(P);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var C=Object.create;var p=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var E=(e,t)=>{for(var o in t)p(e,o,{get:t[o],enumerable:!0})},f=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of L(t))!g.call(e,r)&&r!==o&&p(e,r,{get:()=>t[r],enumerable:!(i=R(t,r))||i.enumerable});return e};var b=(e,t,o)=>(o=e!=null?C(N(e)):{},f(t||!e||!e.__esModule?p(o,"default",{value:e,enumerable:!0}):o,e)),V=e=>f(p({},"__esModule",{value:!0}),e);var w={};E(w,{default:()=>q});module.exports=V(w);var n=require("react/jsx-runtime"),k=b(require("react")),u=require("@radix-ui/react-slot"),x=require("../helpers/index.js"),d=require("class-variance-authority");const S=(0,d.cva)("tracking hover:text-brand-0 font-bold underline transition-colors",{variants:{size:{base:"text-text-2",lg:"text-text-3"},variant:{secondary:"text-info-secondary hover:text-info-primary",primary:"text-info-primary hover:text-brand-0"}}}),y=k.default.forwardRef(({children:e,size:t="base",variant:o="primary",className:i,asChild:r=!1,href:m,style:l,disabled:a=!1,suffixIcon:s,onClick:v,...P},h)=>(0,n.jsx)(r?u.Slot:"a",{ref:h,onClick:c=>{if(!a&&v?.(c),a||!m){c.preventDefault();return}},href:a?void 0:m,className:(0,x.cn)(S({size:t,variant:o}),i,{"flex items-center":s,"cursor-pointer":!a,"text-info-quaternary cursor-not-allowed hover:text-info-quaternary":a}),...l?{style:l}:null,...P,children:r?e:(0,n.jsxs)(n.Fragment,{children:[e,s&&(0,n.jsx)("span",{className:"svg",children:s})]})}));y.displayName="Link";var q=y;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var s=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var L=Object.prototype.hasOwnProperty;var b=(e,n)=>{for(var r in n)s(e,r,{get:n[r],enumerable:!0})},E=(e,n,r,i)=>{if(n&&typeof n=="object"||typeof n=="function")for(let t of y(n))!L.call(e,t)&&t!==r&&s(e,t,{get:()=>n[t],enumerable:!(i=f(n,t))||i.enumerable});return e};var R=e=>E(s({},"__esModule",{value:!0}),e);var I={};b(I,{PRICE_SYMBOL:()=>S,extendLocaleMap:()=>A,formatPrice:()=>D,languageTerritory:()=>d});module.exports=R(I);const S={us:"$",uk:"\xA3",ca:"$",eu:"\u20AC",fr:"\u20AC",de:"\u20AC",nl:"\u20AC",vn:"\u20AB",cl:"$",sg:"$",ae:"AED"},u={us:"en-US",uk:"en-GB",ca:"en-CA",au:"AU","eu-en":"en","eu-fr":"fr-FR",fr:"FR","ca-fr":"FR","nl-fr":"FR",my:"MY",it:"IT",vn:"VN",es:"es-ES","eu-it":"it-IT","eu-de":"de-DE",de:"de-DE","eu-es":"es-ES","cz-en":"en-CZ",nl:"nl-NL","dk-en":"en-DK","gr-en":"en-GR","mk-en":"en-MK","hu-en":"en-HU","se-en":"en-SE","hr-en":"en-HR","bg-en":"en-BG","ee-en":"en-EE","fi-en":"en-FI","lt-en":"en-LT",pl:"pl-PL","ro-en":"en-RO","si-en":"en-SI","sk-en":"en-SK","no-en":"en-NO","ad-en":"en-AD","al-en":"en-AL","ba-en":"en-BA","me-en":"en-ME","rs-en":"en-RS","gl-en":"en-GL","is-en":"en-IS","ua-en":"en-UA","by-en":"en-BY","md-en":"en-MD","lv-en":"en-LV","at-de":"de-AT","lu-de":"de-LU","li-de":"de-LI","va-it":"it-VA","sm-it":"it-SM","be-nl":"nl-BE","ae-en":"en-AE",nz:"en-NZ","sg-en":"en-SG","sa-en":"en-SA","vn-vi":"vi-VN",ie:"en-IE",tw:"zh-TW"};let c={},o=u;const A=e=>{c={...c,...e},o={...u,...c}},d=e=>o[e]||"";function D({amount:e,currencyCode:n,locale:r,maximumFractionDigits:i,minimumFractionDigits:t,removeTrailingZeros:m=!1,currencyDisplay:g="symbol"}){const p=r==="nl"?"EUR":n||"USD",l=d(r);if(!l)return null;let a=new Intl.NumberFormat(l,{style:"currency",currency:p,currencyDisplay:g,minimumFractionDigits:i===0?0:t,maximumFractionDigits:i})?.format?.(e);return["eu-de","eu-en","de","eu"].includes(r)&&(a=a?.toString()?.replace?.(/[\s]/g,"")),m&&(a=a?.replace?.(/(\.\d*?[1-9])0+\b/,"$1")?.replace?.(/\.0+\b/,"")?.replace?.(/(,\d*?[1-9])0+\b/,"$1")?.replace?.(/,0+\b/,"")),a}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var m=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var
|
|
1
|
+
"use strict";var m=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var M=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var E=(n,o)=>{for(var s in o)m(n,s,{get:o[s],enumerable:!0})},O=(n,o,s,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let t of M(o))!x.call(n,t)&&t!==s&&m(n,t,{get:()=>o[t],enumerable:!(i=D(o,t))||i.enumerable});return n};var T=n=>O(m({},"__esModule",{value:!0}),n);var U={};E(U,{useDraggableScroll:()=>F});module.exports=T(U);var l=require("react");function F(n={}){const{dragSpeed:o=1,enableMomentum:s=!0,dragElastic:i=.1}=n,t=(0,l.useRef)(null),[b,W]=(0,l.useState)(!1),[S,h]=(0,l.useState)(0),[d,R]=(0,l.useState)(!1),[L,v]=(0,l.useState)(!1),a=()=>{const r=t.current;if(!r)return;const{scrollLeft:e,scrollWidth:c,clientWidth:u}=r,f=c-u,p=f>0?e/f*100:0;h(Math.min(100,Math.max(0,p))),R(e>0),v(e<f-1)};(0,l.useEffect)(()=>{const r=t.current;if(!r)return;a(),r.addEventListener("scroll",a);const e=new ResizeObserver(a);return e.observe(r),()=>{r.removeEventListener("scroll",a),e.disconnect()}},[]);const g=(r,e=!0)=>{const c=t.current;c&&c.scrollTo({left:r,behavior:e?"smooth":"auto"})};return{containerRef:t,isDragging:b,scrollProgress:S,canScrollLeft:d,canScrollRight:L,scrollTo:g,scrollLeft:(r=300)=>{const e=t.current;if(!e)return;const c=Math.max(0,e.scrollLeft-r);g(c)},scrollRight:(r=300)=>{const e=t.current;if(!e)return;const c=e.scrollWidth-e.clientWidth,u=Math.min(c,e.scrollLeft+r);g(u)}}}
|
|
@@ -9,5 +9,5 @@ interface ExposureOptions {
|
|
|
9
9
|
pageGroup?: string;
|
|
10
10
|
position?: number;
|
|
11
11
|
}
|
|
12
|
-
export declare const useExposure: (ref: RefObject<HTMLElement
|
|
12
|
+
export declare const useExposure: (ref: RefObject<HTMLElement>, { componentType, componentName, componentTitle, componentDescription, navigation, position }: ExposureOptions) => void;
|
|
13
13
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var a=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var b=(o,e)=>{for(var i in e)a(o,i,{get:e[i],enumerable:!0})},S=(o,e,i,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!y.call(o,t)&&t!==i&&a(o,t,{get:()=>e[t],enumerable:!(r=_(e,t))||r.enumerable});return o};var O=o=>S(a({},"__esModule",{value:!0}),o);var h={};b(h,{useExposure:()=>j});module.exports=O(h);var n=require("react"),d=require("../shared/track.js"),f=require("./useIntersectionObserver.js"),x=require("../biz-components/AiuiProvider/index.js"),p=require("@payloadcms/richtext-lexical/plaintext");const j=(o,{componentType:e,componentName:i,componentTitle:r,componentDescription:t,navigation:s="",position:c=1})=>{const{trackingData:E,onExposure:
|
|
1
|
+
"use strict";var a=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var b=(o,e)=>{for(var i in e)a(o,i,{get:e[i],enumerable:!0})},S=(o,e,i,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!y.call(o,t)&&t!==i&&a(o,t,{get:()=>e[t],enumerable:!(r=_(e,t))||r.enumerable});return o};var O=o=>S(a({},"__esModule",{value:!0}),o);var h={};b(h,{useExposure:()=>j});module.exports=O(h);var n=require("react"),d=require("../shared/track.js"),f=require("./useIntersectionObserver.js"),x=require("../biz-components/AiuiProvider/index.js"),p=require("@payloadcms/richtext-lexical/plaintext");const j=(o,{componentType:e,componentName:i,componentTitle:r,componentDescription:t,navigation:s="",position:c=1})=>{const{trackingData:E,onExposure:m}=(0,x.useAiuiContext)(),l=(0,n.useMemo)(()=>typeof r=="object"&&r!==null?(0,p.convertLexicalToPlaintext)({data:r}):r,[r]),u=(0,n.useMemo)(()=>typeof t=="object"&&t!==null?(0,p.convertLexicalToPlaintext)({data:t}):t,[t]);(0,f.useIntersectionObserverDelay)(o,{once:!0,threshold:.5,delay:2e3,callback:()=>{const g=E.pageGroup||"Home Page";m?m({componentType:e,componentName:i,componentTitle:l,componentDescription:u,navigation:s,pageGroup:g,position:c}):(0,d.gaTrack)({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:g,component_type:e,component_name:i,position:c,creative_id:"",component_title:l,component_description:u,navigation:s}})}})};
|
|
@@ -17,5 +17,5 @@ interface ViewItemListOptions {
|
|
|
17
17
|
index: number;
|
|
18
18
|
}>;
|
|
19
19
|
}
|
|
20
|
-
export declare const useViewItemList: (ref: RefObject<HTMLElement
|
|
20
|
+
export declare const useViewItemList: (ref: RefObject<HTMLElement>, { componentType, componentName, componentTitle, componentDescription, navigation, position, itemListName, items, tabName, }: ViewItemListOptions) => void;
|
|
21
21
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as h}from"react/jsx-runtime";import*as n from"react";import{cn as r}from"../../helpers/index.js";import{Text as b,Picture as A,Heading as
|
|
1
|
+
"use client";import{jsx as t,jsxs as h}from"react/jsx-runtime";import*as n from"react";import{cn as r}from"../../helpers/index.js";import{Text as b,Picture as A,Heading as u,Container as N,Link as C}from"../../components/index.js";import{cva as m}from"class-variance-authority";import{Swiper as P,SwiperSlide as V}from"swiper/react";import{withLayout as z}from"../../shared/Styles.js";const I=m("rounded-card laptop:px-6 laptop:py-4 relative flex min-w-0 flex-col justify-between gap-2 overflow-hidden px-4 py-3",{variants:{state:{"active-light":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","active-dark":"bg-gradient-to-r from-[#3555aa] to-[#6988e3]","inactive-light":"bg-[#EAEAEC]","inactive-dark":"bg-[#1E2024]"},size:{small:"laptop:h-[160px] h-[120px]",large:"laptop:h-[240px] h-[200px]"}},defaultVariants:{state:"inactive-light",size:"small"}}),v=m("font-bold leading-[1.2]",{variants:{state:{"active-light":"text-white","active-dark":"text-white","inactive-light":"text-[#080A0F]","inactive-dark":"text-white"}},defaultVariants:{state:"inactive-light"}}),f=n.memo(({item:e,theme:i="light",className:d,size:o})=>{const s=e.isActive||!1,l=`${s?"active":"inactive"}-${i}`;return t("div",{className:r(I({state:l,size:o}),d),"data-ui-component-id":"ActivityScheduleCard",children:h(C,{asChild:!e?.link,href:e?.link,className:"size-full no-underline hover:text-current",children:[(s?e.activeIcon:e.inactiveIcon)&&t("div",{className:"laptop:w-[160px] aspect-1 absolute right-0 top-0 z-10 w-[120px]",children:t(A,{source:s?e.activeIcon.url:e.inactiveIcon.url,alt:s?e.activeIcon.alt:e.inactiveIcon.alt,className:"aspect-square"})}),h("div",{className:"relative z-20 flex h-full flex-col justify-between",children:[t(u,{as:"h3",size:3,html:e.title,className:r(v({state:l}))}),h("div",{className:"flex flex-col gap-1",children:[t("div",{className:"flex flex-col justify-end overflow-hidden",children:t(u,{as:"h4",size:2,html:e.subtitle,className:r(" line-clamp-2",v({state:l}))})}),o==="large"&&e.description&&t(b,{html:e.description,className:r("lg-desktop:text-[18px] desktop:text-[16px] line-clamp-3 text-[14px] leading-[1.4]",v({state:l}))})]})]})]})})});f.displayName="ActivityScheduleCard";const g=n.forwardRef(({classNames:e={},data:i,...d},o)=>{const s=i.theme||"light",l=i.size||"large",a=n.useMemo(()=>i?.scheduleList?.length||2,[i?.scheduleList]),w=n.useMemo(()=>{const c=S=>{switch(S){case"mobile":return{slidesPerView:1.17,spaceBetween:12};case"tablet":return a===2?{slidesPerView:2,spaceBetween:12}:{slidesPerView:2.4,spaceBetween:12};case"laptop":return a===2?{}:a===4?{slidesPerView:3.2,spaceBetween:16}:{slidesPerView:a,spaceBetween:16};case"desktop":return a===2?{slidesPerView:2,spaceBetween:16}:{slidesPerView:a,spaceBetween:16}}},p=c("mobile"),x=c("tablet"),y=c("laptop"),k=c("desktop");return{0:p,768:x,1024:y,1440:k}},[a]);return t(N,{ref:o,className:r(e?.root),childClassName:"overflow-hidden","data-ui-component-id":"ActivitySchedule",...d,children:t(P,{breakpoints:w,className:"w-full !overflow-visible",children:i.scheduleList.map((c,p)=>t(V,{children:t(f,{item:c,theme:s,size:l,className:e?.card})},"activityScheduleCardItem"+p))})})});g.displayName="ActivitySchedule";var R=z(g);export{R as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{forwardRef as w,useEffect as q,useRef as
|
|
1
|
+
"use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{forwardRef as w,useEffect as q,useRef as x,useState as E,useImperativeHandle as S}from"react";import{cn as s}from"../../helpers/utils.js";import v from"../../components/picture.js";import{withLayout as M}from"../../shared/Styles.js";import{useMediaQuery as B}from"react-responsive";import{useExposure as T}from"../../hooks/useExposure.js";import{Swiper as I,SwiperSlide as j}from"swiper/react";import{Pagination as P,FreeMode as L,Mousewheel as z}from"swiper/modules";import A from"../Title/index.js";const H="copy",D="store_benefits",R=(e,a)=>{const i=[];for(let r=0;r<e.length;r+=a)i.push(e.slice(r,r+a));return i},b=w(({data:{items:e=[],itemShape:a,title:i,theme:r},className:o},m)=>{const[c,h]=E(!1),u=B({query:"(max-width: 768px)"}),f=x(null),d=x(null);S(m,()=>d.current),T(d,{componentType:H,componentName:D}),q(()=>{h(u)},[u]);const k=c?R(e,3):e;return n("div",{ref:d,className:s("brand-equity-wrapper w-full",{"aiui-dark":r==="dark"},o),children:[i&&t(A,{data:{title:i}}),c?n(I,{className:s(o),modules:[L,z,P],freeMode:!0,mousewheel:{forceToAxis:!0},pagination:{clickable:!0,el:f.current},breakpoints:{0:{spaceBetween:12}},children:[k?.map((l,p)=>t(j,{className:"!flex flex-col gap-3",children:Array.isArray(l)&&l?.map((N,y)=>t(g,{data:N,itemShape:a,index:y,theme:r},y))},"SwiperSlide"+p)),t("div",{ref:f,className:"mt-3 flex justify-center"})]}):t("div",{className:s("grid grid-cols-1 gap-3","tablet:grid-cols-2","laptop:gap-4 laptop:grid-cols-10"),children:e.map((l,p)=>t(g,{data:l,itemShape:a,index:p,theme:r},p))})]})}),g=({data:e,itemShape:a,index:i,theme:r})=>n("div",{className:s("brand-equity-item",`brand-equity-item-${i+1}`,e.containerName?`brand-equity-item--${e.containerName}`:void 0,"bg-container-secondary-1 box-border flex w-full flex-col p-4","desktop:p-6 justify-between","laptop:col-span-3 lg-desktop:p-8","laptop:h-[192px] lg-desktop:h-[240px] h-[160px]",{"laptop:col-span-4":[0,5,6,11].includes(i),"bg-container-primary":r==="dark"},"rounded-box",e.className),children:[n("div",{className:"lg-desktop:h-[36px] flex h-[30px] items-center justify-between gap-3",children:[t("h3",{className:"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary text-[14px] font-bold leading-[1.2] tracking-[-0.02em]",children:e.title}),e.type==="avatar"?t("div",{className:"flex shrink-0 -space-x-2",children:e?.avatarList?.map((o,m)=>t("div",{className:s("border-container-primary size-[30px] overflow-hidden rounded-full border-2","relative inline-block shrink-0","lg-desktop:size-[36px]"),children:t(v,{source:o.avatar?.url,alt:o.avatar?.alt,className:"size-full object-cover"})},m))}):t("div",{className:"lg-desktop:size-[36px] size-[30px] shrink-0",children:t(v,{className:"size-full object-cover",source:e.icon?.url,alt:e.icon?.alt,imgClassName:"w-full h-full object-cover"})})]}),t("p",{className:"lg-desktop:text-[24px] text-info-primary line-clamp-3 text-[20px] font-bold leading-[1.2] tracking-[-0.04em]",children:e.description})]});b.displayName="BrandEquity";var U=M(b);export{U as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{Fragment as Pe,jsx as e,jsxs as o}from"react/jsx-runtime";import{forwardRef as ae,useCallback as ne,useEffect as J,useImperativeHandle as Ee,useMemo as E,useRef as Y,useState as T}from"react";import{Picture as me,Text as x,Button as oe,Container as pe,BrandStrip as Te}from"../../components/index.js";import{withLayout as He}from"../../shared/Styles.js";import{cn as k,getLocalizedPath as ie}from"../../helpers/utils.js";import Le,{useNavContext as te}from"./NavProvider.js";import{HeaderNavigationMenu as W,HeaderNavigationBlockType as H,HeaderNavigationActionBlockType as C}from"./types.js";import ze from"jump.js";import{useGSAP as le}from"@gsap/react";import{gsap as re}from"gsap";import{WithSidebar as fe,WithSupports as be,WithMulticol as ve,WithGroupCategory as ge,WithResource as he}from"./withCategory.js";import{Menu as Be,Close as ye,User as Re,LeftArrow as Ie,DownArrow as Ne,Polygon as Ae}from"./icons/index.js";import Oe from"../NavigationSearch/index.js";import{ResourceSidebarDropdown as je}from"./ResourceSidebarDropdown.js";import{MobileResourceSidebarMenu as _e}from"./MobileResourceSidebarMenu.js";import{SidebarDropdown as We}from"./SidebarDropdown.js";import{useScrollLock as se}from"./useScrollLock.js";import{MulticolDropdown as $e}from"./MulticolDropdown.js";import{SupportsDropdown as Ke}from"./SupportsDropdown.js";import{MobileSidebarMenu as Fe}from"./MobileSidebarMenu.js";import{MobileSupportMenu as Ue}from"./MobileSupportMenu.js";import{MobileMulticolMenu as Ge}from"./MobileMulticolMenu.js";import{MenuItem as ce}from"./MobileMenuComponents.js";import{useAiuiContext as ue}from"../AiuiProvider/index.js";import ke from"../../shared/throttle.js";const we=ae((a,l)=>{const{data:{header:r}={},buildProps:s,event:f,profile:M,theme:n="light",isTop:c=!1,searchResult:N,onSearch:m,isSearching:u,keywords:$,onPrimaryNavClick:y,onSeriesProductClick:v,onSidebarNavClick:S,onMobileMenuToggle:q,headerId:P,cartCount:z,menuData:B,render:R,componentOverrides:Q,...V}=a,[I,d]=T(!1),[K,A]=T(!1),[O,L]=T(!1),[F,b]=T(!1),j=Y(null),w=Y(null),X=()=>{const g=window.innerWidth||0;b(g<1440)};J(()=>(X(),window.addEventListener("resize",X),()=>{window.removeEventListener("resize",X)}),[]),Ee(l,()=>w.current),J(()=>{w.current&&c&&ze(w.current,{duration:0,offset:w.current?.getBoundingClientRect()?.bottom||0})},[c]),J(()=>{if(c){A(!1),L(!1);return}let g=0,t=0,i=0;const p=()=>document?.documentElement?.scrollTop||document?.body?.scrollTop||0,h=p();g=h,A(h>300),L(h>30);const U=ke(()=>{const D=p(),G=D-g;L(D>30),G>0?(t=0,i+=G,i>=300&&D>300&&A(!0)):G<0&&(i=0,t+=Math.abs(G),t>=300&&(A(!1),t=0)),g=D},100);return window.addEventListener("scroll",U,{passive:!0}),()=>window.removeEventListener("scroll",U)},[c]),J(()=>{f&&(f.search=()=>d(!0))},[f]),le(()=>{j?.current&&I&&re.fromTo(j.current,{height:0},{height:"auto",duration:.3})},[I]),se(I);const Z=E(()=>r?.bar?.actions?.find(g=>g?.blockType===C.Search)?.searchBar?.[0]||{},[r]),_=R?.mobileHeaderNavigation;return e(Le,{buildProps:s,profile:M,isMobile:F,event:f,payloadData:r,onSidebarNavClick:S,onSeriesProductClick:v,cartCount:z,componentOverrides:Q,children:e("header",{...V,id:P||"header","data-ui-component-id":"HeaderNavigation",className:c?"relative z-[100] bg-white":k("sticky top-0 z-[100] transition-transform duration-500 ease-in-out",{"translate-y-[-100%]":K}),ref:w,children:o("div",{className:k("hover:bg-white hover:text-black",n==="light"?"text-black":"text-white",{"!bg-white transition-all duration-500 ease-in-out":!c&&O},{"hover:!text-black":n==="dark","!text-black":!c&&O}),onClick:()=>!c&&L(!0),children:[e(xe,{data:r,className:k("hidden !bg-white",!F&&"block"),theme:n,onNavItemClick:()=>!c&&L(!0),onPrimaryNavClick:y}),_?e(_,{className:k("block !bg-white",!F&&"hidden"),menuData:B,data:r,onPrimaryNavClick:y}):e(Ce,{menuData:B,data:r,className:k("block !bg-white",!F&&"hidden"),onPrimaryNavClick:y,onMobileMenuToggle:q}),I&&o("div",{className:"absolute left-0 top-0 z-[60] flex w-full flex-col bg-black/70",style:{height:`calc(100dvh - ${w?.current?.getBoundingClientRect()?.top}px)`},role:"dialog","aria-modal":"true","aria-label":"Search",children:[e("div",{ref:j,className:k("overflow-y-auto",{}),children:e(Oe,{data:Z,keywords:$,isSearching:u,searchResult:N,onSearch:g=>{m?.(g)},onClose:()=>{m?.(),d(!1)}})}),e("div",{className:"flex-1 bg-transparent",onClick:()=>d(!1),role:"button",tabIndex:0,"aria-label":"Close search",onKeyDown:g=>{(g.key==="Enter"||g.key===" "||g.key==="Escape")&&(g.preventDefault(),d(!1))}})]})]})})})}),xe=ae((a,l)=>{const{data:r,onNavItemClick:s,className:f,theme:M,onPrimaryNavClick:n}=a,{event:c,profile:N}=te(),[m,u]=T(!1),{locale:$="us"}=ue(),y=E(()=>ge(r?.categories?.filter(t=>t?.pcShow)),[r]),[v,S]=T(null),[q,P]=T([]),z=Y(null),[B,R]=T(!1),Q=Y(null),V=Y(null),I=Y(y.map(t=>Array(t?.length||0).fill(null)));J(()=>{y?.length&&P(y?.map((t,i)=>t?.map((p,h)=>({groupIndex:i,index:h,open:!1}))))},[y]);const d=E(()=>{let t=null;for(const i of q){for(const p of i)if(p.open){t=p;break}if(t)break}return t},[q]);se(!!d?.open||B);const K=(t,i,p)=>{R(!1);const h=y[i][p];if(h?.components?.[0]?.blockType===H.Links)h?.components?.[0]?.url&&window.open(h?.components?.[0]?.url,h?.components?.[0]?.target??"_blank");else{const U=y?.flat()||[],D=U?.findIndex(G=>G?.id===y[i][p]?.id);t.stopPropagation(),s?.(),n?.(U[D],D),S(h),P(G=>G.map(De=>De.map(ee=>ee.groupIndex===i&&ee.index===p?{...ee,open:!ee.open}:{...ee,open:!1})))}},A=(t,i,p)=>{t.key==="Enter"||t.key===" "?(t.preventDefault(),K(t,i,p)):t.key==="Escape"&&d?.groupIndex===i&&d?.index===p&&(t.preventDefault(),O())},O=()=>{P(t=>t.map(i=>i.map(p=>({...p,open:!1}))))},L=E(()=>{if(v)return v?.components?.[0]?.blockType},[v]),F=fe(We,v),b=he(je,v),j=ve($e,v),w=be(Ke,{categoriesItem:v,currentNavItemRef:I.current?.[d?.groupIndex||0]?.[d?.index||0]}),X=E(()=>{switch(L){case H.Sidebar:return e(F,{});case H.Resource:return e(b,{});case H.Supports:return e(w,{});case H.Multicol:return e(j,{});default:return null}},[L,v]),Z=E(()=>r?.bar?.actions?.filter(t=>t?.pcShow),[r]),_=E(()=>Z?.find(t=>t?.blockType===C.Profile),[Z]),g=ne(()=>{R(t=>!t)},[]);return J(()=>{if(z?.current){const t=z.current;return t.addEventListener("click",g),()=>{t.removeEventListener("click",g)}}},[g]),le(()=>{d?.open&&re.fromTo(V?.current,{height:0},{height:"auto"})},[d?.open]),o(pe,{className:k("relative h-[92px]",f),children:[o("div",{ref:Q,onClick:O,className:"flex h-full flex-col justify-end gap-4",children:[o("div",{className:"flex items-center justify-between",children:[e(Me,{}),e(de,{ref:z,actions:Z,activeStatus:B})]}),e("nav",{className:"flex justify-between",role:"navigation","aria-label":"Primary navigation",children:y?.map((t,i)=>e("div",{className:"flex gap-3",children:t?.map((p,h)=>{const U=d?.groupIndex===i&&d?.index===h;return e("div",{ref:D=>{I.current[i][h]=D},className:"group",children:o("div",{className:"relative",children:[o("button",{className:"flex cursor-pointer items-center gap-1 border-0 bg-transparent pb-4",onClick:D=>K(D,i,h),onKeyDown:D=>A(D,i,h),"aria-expanded":U,"aria-haspopup":"true","aria-label":p.text,children:[e(x,{html:p.text,className:"text-sm font-bold leading-[1.4]"}),e(Ne,{className:k("size-4 opacity-0 transition-opacity duration-500 group-hover:opacity-100",{"rotate-180":d?.groupIndex===i&&d?.index===h,"opacity-100":m&&d?.groupIndex===i&&d?.index===h,invisible:!p?.components?.length||p?.components?.[0]?.blockType===H.Links})})]}),e("div",{className:k("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":U},M==="dark"?"bg-white":"bg-[#080A0F]"),"aria-hidden":"true"})]})},p.id)})},`groupCategory-${i}`))})]}),o("div",{role:"menu","aria-hidden":!(d?.open&&v),className:k("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:!(d?.open&&v)}),onMouseEnter:()=>u(!0),onMouseLeave:()=>u(!1),style:{height:`calc(100dvh - ${Q?.current?.getBoundingClientRect()?.bottom}px)`},children:[e("div",{ref:V,className:k("relative z-50",{"overflow-hidden":L!==H.Supports}),children:X}),e("div",{className:"flex-1 bg-transparent",onClick:O,role:"button",tabIndex:0,"aria-label":"Close menu",onKeyDown:t=>{(t.key==="Enter"||t.key===" "||t.key==="Escape")&&(t.preventDefault(),O())}})]}),B&&o("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:[e("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:N?.email?o(Pe,{children:[e(x,{html:N?.nick_name||_?.welcome,className:"text-sm font-bold"}),e("div",{className:"mt-2 h-px bg-[#D9D9D9]","aria-hidden":"true"}),e("nav",{className:"mt-2",role:"navigation","aria-label":"Profile navigation",children:_?.profiles?.map(t=>e(ce,{className:"py-2",label:t?.title,href:ie(t?.url,$)},t.id))})]}):o(Pe,{children:[e(Ae,{className:"absolute -top-2 right-[46px] z-30 text-white","aria-hidden":"true"}),e(x,{html:_?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),e("div",{className:"mt-2 flex flex-col gap-1",children:_?.benefits?.map(t=>o("div",{className:"flex items-center gap-[6px]",children:[e(me,{source:t.benefitIcon?.url,className:"size-4 shrink-0",alt:t.benefit,width:16,height:16}),e(x,{html:t.benefit,className:"text-sm font-bold leading-[1.4]"})]},t.id))}),o("div",{className:"mt-4 flex flex-wrap gap-2",children:[e(oe,{className:"grow",variant:"secondary",size:"lg",onClick:()=>c?.join?.(),children:e(x,{html:_?.primaryButton||"Join Now",className:"font-bold"})}),e(oe,{className:"grow",variant:"primary",size:"lg",onClick:()=>c?.login?.(),children:e(x,{html:_?.secondaryButton||"Log In",className:"font-bold"})})]})]})}),e("div",{className:"flex-1 bg-transparent",onClick:()=>R(!1),role:"button",tabIndex:0,"aria-label":"Close profile menu",onKeyDown:t=>{(t.key==="Enter"||t.key===" "||t.key==="Escape")&&(t.preventDefault(),R(!1))}})]})]})}),Ce=ae(({data:a,menuData:l,className:r,onPrimaryNavClick:s,onMobileMenuToggle:f},M)=>{const n=E(()=>ge(a?.categories?.filter(b=>b?.mobileShow)),[a]),{currentMenu:c,setCurrentMenu:N,subSubCategory:m}=te(),[u,$]=T(!1),[y,v]=T(0),[S,q]=T(null),P=Y(null),z=Y(!1);J(()=>{if(P?.current&&u){const b=P?.current?.getBoundingClientRect();v(window?.innerHeight-(b?.top||0))}f?.({open:u})},[u,f]),J(()=>{if(!u)return;const b=ke(()=>{if(P?.current){const j=P.current.getBoundingClientRect();z.current=!0,v(window?.innerHeight-(j?.top||0))}},100);return window.addEventListener("resize",b),()=>window.removeEventListener("resize",b)},[u]),le(()=>{if(z.current){re.set(P.current,{height:y}),z.current=!1;return}re.fromTo(P.current,{height:0},{height:y,duration:.3})},[y]),se(u);const B=E(()=>S?.components?.[0]?.blockType,[S]),R=be(Ue,{categoriesItem:S}),Q=fe(Fe,S),V=he(_e,S),I=ve(Ge,S),d=E(()=>{switch(B){case H.Sidebar:return e(Q,{});case H.Resource:return e(V,{});case H.Supports:return e(R,{});case H.Multicol:return e(I,{});default:return null}},[B,S,R]),K=ne(()=>{$(!1),v(0),N&&N(W.Primary)},[$,v,N]),A=E(()=>a?.bar?.actions?.filter(b=>b?.mobileShow&&b?.blockType!==C.Profile),[a]),O=E(()=>a?.bar?.actions?.find(b=>b?.mobileShow&&b?.blockType===C.Profile)||{},[a]),L=E(()=>{switch(c){case W.Primary:return e(qe,{actions:A,menuOpen:u,onMenuOpenClose:()=>{$(!1),v(0)},onMenuOpenClick:()=>$(!0)});case W.Secondary:return e(Se,{title:S?.text,onMenuOpenClose:K,onMenuBackClick:()=>N?.(W.Primary)});case W.Third:return e(Se,{title:m?.label,onMenuOpenClose:K,onMenuBackClick:()=>N?.(W.Secondary)});default:return null}},[u,c,N,S,A,m,K]),F=ne((b,j)=>{const w=Array.isArray(n)?Array.isArray(n[b])?n[b][j]:{}:{};q(w),w?.components?.[0]?.blockType===H.Links?w?.components?.[0]?.url&&window.open(w?.components?.[0]?.url,w?.components?.[0]?.target??"_blank"):N?.(W.Secondary)},[n,N]);return o(pe,{className:k("relative h-[56px]",r),children:[L,u&&o("nav",{ref:P,className:"absolute left-0 top-full z-[999] w-full overflow-y-auto border-t border-[#E4E5E6] bg-white text-black",style:{height:y},role:"navigation","aria-label":"Mobile navigation menu",children:[c===W.Primary&&l?e("div",{className:"pt-4",children:e(Te,{data:l})}):null,c===W.Primary?e(Je,{categories:n,onPrimaryMenuClick:F,onPrimaryNavClick:s,profileAction:O}):d]})]})}),Je=({categories:a,onPrimaryMenuClick:l,profileAction:r,onPrimaryNavClick:s})=>o("div",{className:"flex h-full flex-col justify-between",children:[e("div",{className:"tablet:px-8 laptop:px-16 p-4",children:a?.map((f,M)=>o("div",{className:"",children:[e("div",{className:k("my-2 h-px w-full bg-[#E5E5E7]")}),f?.map((n,c)=>e(ce,{label:n.text,onClick:()=>{const m=(a?.flat()||[])?.findIndex(u=>u?.id===a[M][c]?.id);l(M,c),s?.(n,m)},icon:n.components?.[0]?.icon},n.id))]},`groupCategory-${M}`))}),e(Ye,{profileAction:r})]}),Ye=({profileAction:a})=>{const[l,r]=T(!1),{profile:s,event:f}=te(),{locale:M="us"}=ue();return o("div",{className:k("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":l}),children:[o("button",{className:"flex w-full cursor-pointer items-center justify-between border-0 bg-transparent",onClick:()=>r(!l),"aria-expanded":l,"aria-label":s?.nick_name||a?.welcome,children:[o("div",{className:"flex items-center gap-[14px]",children:[e("div",{className:"flex size-[40px] shrink-0 items-center justify-center rounded-full bg-white",children:e(Re,{"aria-hidden":"true"})}),e(x,{html:s?.nick_name||a?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!s?.email&&e(Ne,{"aria-hidden":"true",className:k("laptop:size-4 size-5",{"rotate-180":l})})]}),s?.email&&e("nav",{className:"mt-4",role:"navigation","aria-label":"Profile menu",children:a?.profiles?.map(n=>e(ce,{label:n?.title,href:ie(n?.url,M)},n.id))}),l&&!s?.email&&o("div",{className:"mt-4",children:[e(x,{html:a?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),e("div",{className:"mt-2 flex flex-col gap-1",children:a?.benefits?.map(n=>o("div",{className:"flex items-center gap-[6px]",children:[e(me,{source:n.benefitIcon?.url,className:"size-4",alt:n.benefit,width:16,height:16}),e(x,{html:n.benefit,className:"text-sm font-bold leading-[1.4]"})]},n.id))})]}),!s?.email&&o("div",{className:"mt-4 flex items-center gap-3",children:[e(oe,{className:"tablet:flex-none flex-1",variant:"secondary",size:"base",onClick:()=>f?.join?.(),children:e(x,{html:a?.primaryButton||"Join Now",className:"text-sm font-bold leading-[1.4]"})}),e(oe,{className:"tablet:flex-none flex-1",variant:"primary",size:"base",onClick:()=>f?.login?.(),children:e(x,{html:a?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},qe=({menuOpen:a,onMenuOpenClose:l,onMenuOpenClick:r,actions:s})=>o("div",{className:"flex h-full items-center justify-between gap-4",children:[e(Me,{}),o("div",{className:"desktop:gap-6 flex items-center gap-4",children:[e(de,{actions:s}),a?e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>l(),"aria-label":"Close menu","aria-expanded":"true",children:e(ye,{className:"size-5","aria-hidden":"true"})}):e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Open menu","aria-expanded":"false","aria-haspopup":"true",children:e(Be,{className:"size-5","aria-hidden":"true"})})]})]}),Me=()=>{const{payloadData:a,isMobile:l}=te(),{locale:r="us"}=ue();return e("a",{href:ie("/",r),className:"hover:text-[#00CBEB] [&>svg]:w-full","aria-label":"Home",dangerouslySetInnerHTML:{__html:l?a?.bar?.mobileLogo:a?.bar?.desktopLogo}})},de=ae(({actions:a,activeStatus:l=!1},r)=>{const{event:s,cartCount:f}=te(),[M,n]=T(null),c=m=>{switch(m){case C.Search:return"Search";case C.Cart:return`Shopping cart${f>0?` (${f} items)`:""}`;case C.Profile:return"User profile";case C.Livestream:return"Livestream";default:return"Action"}},N=ne((m,u)=>{switch(n(u),m?.blockType){case C.Search:s?.search?.();break;case C.Cart:s?.cart?.();break;case C.Profile:s?.profile?.();break;case C.Livestream:s?.livestream?.();break;default:return()=>{}}},[s]);return e("div",{className:"desktop:gap-6 flex items-center gap-4",children:Array.isArray(a)&&a?.map((m,u)=>o("button",{className:"relative cursor-pointer border-0 bg-transparent p-0","data-tag":m?.tag||"",ref:m.blockType===C.Profile?r:null,onClick:()=>N(m,u),"aria-label":c(m.blockType),"aria-pressed":l&&M===u,children:[e(x,{html:m.icon,className:k("size-5",{"text-brand-0":l&&M===u}),"aria-hidden":"true"}),m.blockType===C.Cart&&f>0&&e("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:e(x,{html:f?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},m.id))})}),Se=({title:a,onMenuOpenClose:l,onMenuBackClick:r})=>o("div",{className:"flex h-full items-center gap-3",children:[e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Back to previous menu",children:e(Ie,{className:"size-5","aria-hidden":"true"})}),e(x,{html:a,className:"flex-1 text-center text-base font-bold leading-[1.4]"}),e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>l(),"aria-label":"Close menu",children:e(ye,{className:"size-5","aria-hidden":"true"})})]});Ce.displayName="MobileNavigation",de.displayName="Actions",we.displayName="HeaderNavigation",xe.displayName="DesktopNavigation";var kt=He(we);export{kt as default};
|
|
1
|
+
"use client";import{Fragment as Pe,jsx as e,jsxs as o}from"react/jsx-runtime";import{forwardRef as ae,useCallback as ne,useEffect as G,useImperativeHandle as Ee,useMemo as D,useRef as J,useState as E}from"react";import{Picture as me,Text as w,Button as oe,Container as pe,BrandStrip as Te}from"../../components/index.js";import{withLayout as He}from"../../shared/Styles.js";import{cn as T,getLocalizedPath as ie}from"../../helpers/utils.js";import Le,{useNavContext as te}from"./NavProvider.js";import{HeaderNavigationMenu as W,HeaderNavigationBlockType as H,HeaderNavigationActionBlockType as x}from"./types.js";import ze from"jump.js";import{useGSAP as le}from"@gsap/react";import{gsap as re}from"gsap";import{WithSidebar as fe,WithSupports as be,WithMulticol as ve,WithGroupCategory as ge,WithResource as he}from"./withCategory.js";import{Menu as Be,Close as ye,User as Re,LeftArrow as Ie,DownArrow as Ne,Polygon as Ae}from"./icons/index.js";import Oe from"../NavigationSearch/index.js";import{ResourceSidebarDropdown as je}from"./ResourceSidebarDropdown.js";import{MobileResourceSidebarMenu as _e}from"./MobileResourceSidebarMenu.js";import{SidebarDropdown as We}from"./SidebarDropdown.js";import{useScrollLock as se}from"./useScrollLock.js";import{MulticolDropdown as $e}from"./MulticolDropdown.js";import{SupportsDropdown as Ke}from"./SupportsDropdown.js";import{MobileSidebarMenu as Fe}from"./MobileSidebarMenu.js";import{MobileSupportMenu as Ue}from"./MobileSupportMenu.js";import{MobileMulticolMenu as Ge}from"./MobileMulticolMenu.js";import{MenuItem as ce}from"./MobileMenuComponents.js";import{useAiuiContext as ue}from"../AiuiProvider/index.js";import ke from"../../shared/throttle.js";const we=ae((a,l)=>{const{data:{header:r}={},buildProps:s,event:f,profile:C,theme:n="light",isTop:c=!1,searchResult:N,onSearch:m,isSearching:u,keywords:$,onPrimaryNavClick:y,onSeriesProductClick:v,onSidebarNavClick:M,onMobileMenuToggle:Y,headerId:S,cartCount:z,menuData:B,render:R,componentOverrides:q,...Q}=a,[I,d]=E(!1),[K,A]=E(!1),[O,L]=E(!1),[V,b]=E(!1),j=J(null),k=J(null),X=()=>{const g=document?.querySelector("body")?.offsetWidth||0;b(g<=1440)};G(()=>(X(),window.addEventListener("resize",X),()=>{window.removeEventListener("resize",X)}),[]),Ee(l,()=>k.current),G(()=>{k.current&&c&&ze(k.current,{duration:0,offset:k.current?.getBoundingClientRect()?.bottom||0})},[c]),G(()=>{if(c){A(!1),L(!1);return}let g=0,t=0,i=0;const p=()=>document?.documentElement?.scrollTop||document?.body?.scrollTop||0,h=p();g=h,A(h>300),L(h>30);const F=ke(()=>{const P=p(),U=P-g;L(P>30),U>0?(t=0,i+=U,i>=300&&P>300&&A(!0)):U<0&&(i=0,t+=Math.abs(U),t>=300&&(A(!1),t=0)),g=P},100);return window.addEventListener("scroll",F,{passive:!0}),()=>window.removeEventListener("scroll",F)},[c]),G(()=>{f&&(f.search=()=>d(!0))},[f]),le(()=>{j?.current&&I&&re.fromTo(j.current,{height:0},{height:"auto",duration:.3})},[I]),se(I);const Z=D(()=>r?.bar?.actions?.find(g=>g?.blockType===x.Search)?.searchBar?.[0]||{},[r]),_=R?.mobileHeaderNavigation;return e(Le,{buildProps:s,profile:C,isMobile:V,event:f,payloadData:r,onSidebarNavClick:M,onSeriesProductClick:v,cartCount:z,componentOverrides:q,children:e("header",{...Q,id:S||"header","data-ui-component-id":"HeaderNavigation",className:c?"relative z-[100] bg-white":T("sticky top-0 z-[100] transition-transform duration-500 ease-in-out",{"translate-y-[-100%]":K}),ref:k,children:o("div",{className:T("hover:bg-white hover:text-black",n==="light"?"text-black":"text-white",{"!bg-white transition-all duration-500 ease-in-out":!c&&O},{"hover:!text-black":n==="dark","!text-black":!c&&O}),onClick:()=>!c&&L(!0),children:[e(xe,{data:r,className:"desktop:block hidden !bg-white",theme:n,onNavItemClick:()=>!c&&L(!0),onPrimaryNavClick:y}),_?e(_,{className:"desktop:hidden block !bg-white",menuData:B,data:r,onPrimaryNavClick:y}):e(Ce,{menuData:B,data:r,className:"desktop:hidden block !bg-white",onPrimaryNavClick:y,onMobileMenuToggle:Y}),I&&o("div",{className:"absolute left-0 top-0 z-[60] flex w-full flex-col bg-black/70",style:{height:`calc(100dvh - ${k?.current?.getBoundingClientRect()?.top}px)`},role:"dialog","aria-modal":"true","aria-label":"Search",children:[e("div",{ref:j,className:T("overflow-y-auto",{}),children:e(Oe,{data:Z,keywords:$,isSearching:u,searchResult:N,onSearch:g=>{m?.(g)},onClose:()=>{m?.(),d(!1)}})}),e("div",{className:"flex-1 bg-transparent",onClick:()=>d(!1),role:"button",tabIndex:0,"aria-label":"Close search",onKeyDown:g=>{(g.key==="Enter"||g.key===" "||g.key==="Escape")&&(g.preventDefault(),d(!1))}})]})]})})})}),xe=ae((a,l)=>{const{data:r,onNavItemClick:s,className:f,theme:C,onPrimaryNavClick:n}=a,{event:c,profile:N}=te(),[m,u]=E(!1),{locale:$="us"}=ue(),y=D(()=>ge(r?.categories?.filter(t=>t?.pcShow)),[r]),[v,M]=E(null),[Y,S]=E([]),z=J(null),[B,R]=E(!1),q=J(null),Q=J(null),I=J(y.map(t=>Array(t?.length||0).fill(null)));G(()=>{y?.length&&S(y?.map((t,i)=>t?.map((p,h)=>({groupIndex:i,index:h,open:!1}))))},[y]);const d=D(()=>{let t=null;for(const i of Y){for(const p of i)if(p.open){t=p;break}if(t)break}return t},[Y]);se(!!d?.open||B);const K=(t,i,p)=>{R(!1);const h=y[i][p];if(h?.components?.[0]?.blockType===H.Links)h?.components?.[0]?.url&&window.open(h?.components?.[0]?.url,h?.components?.[0]?.target??"_blank");else{const F=y?.flat()||[],P=F?.findIndex(U=>U?.id===y[i][p]?.id);t.stopPropagation(),s?.(),n?.(F[P],P),M(h),S(U=>U.map(De=>De.map(ee=>ee.groupIndex===i&&ee.index===p?{...ee,open:!ee.open}:{...ee,open:!1})))}},A=(t,i,p)=>{t.key==="Enter"||t.key===" "?(t.preventDefault(),K(t,i,p)):t.key==="Escape"&&d?.groupIndex===i&&d?.index===p&&(t.preventDefault(),O())},O=()=>{S(t=>t.map(i=>i.map(p=>({...p,open:!1}))))},L=D(()=>{if(v)return v?.components?.[0]?.blockType},[v]),V=fe(We,v),b=he(je,v),j=ve($e,v),k=be(Ke,{categoriesItem:v,currentNavItemRef:I.current?.[d?.groupIndex||0]?.[d?.index||0]}),X=D(()=>{switch(L){case H.Sidebar:return e(V,{});case H.Resource:return e(b,{});case H.Supports:return e(k,{});case H.Multicol:return e(j,{});default:return null}},[L,v]),Z=D(()=>r?.bar?.actions?.filter(t=>t?.pcShow),[r]),_=D(()=>Z?.find(t=>t?.blockType===x.Profile),[Z]),g=ne(()=>{R(t=>!t)},[]);return G(()=>{if(z?.current){const t=z.current;return t.addEventListener("click",g),()=>{t.removeEventListener("click",g)}}},[g]),le(()=>{d?.open&&re.fromTo(Q?.current,{height:0},{height:"auto"})},[d?.open]),o(pe,{className:T("relative h-[92px]",f),children:[o("div",{ref:q,onClick:O,className:"flex h-full flex-col justify-end gap-4",children:[o("div",{className:"flex items-center justify-between",children:[e(Me,{}),e(de,{ref:z,actions:Z,activeStatus:B})]}),e("nav",{className:"flex justify-between",role:"navigation","aria-label":"Primary navigation",children:y?.map((t,i)=>e("div",{className:"flex gap-3",children:t?.map((p,h)=>{const F=d?.groupIndex===i&&d?.index===h;return e("div",{ref:P=>{I.current[i][h]=P},className:"group",children:o("div",{className:"relative",children:[o("button",{className:"flex cursor-pointer items-center gap-1 border-0 bg-transparent pb-4",onClick:P=>K(P,i,h),onKeyDown:P=>A(P,i,h),"aria-expanded":F,"aria-haspopup":"true","aria-label":p.text,children:[e(w,{html:p.text,className:"text-sm font-bold leading-[1.4]"}),e(Ne,{className:T("size-4 opacity-0 transition-opacity duration-500 group-hover:opacity-100",{"rotate-180":d?.groupIndex===i&&d?.index===h,"opacity-100":m&&d?.groupIndex===i&&d?.index===h,invisible:!p?.components?.length||p?.components?.[0]?.blockType===H.Links})})]}),e("div",{className:T("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":F},C==="dark"?"bg-white":"bg-[#080A0F]"),"aria-hidden":"true"})]})},p.id)})},`groupCategory-${i}`))})]}),o("div",{role:"menu","aria-hidden":!(d?.open&&v),className:T("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:!(d?.open&&v)}),onMouseEnter:()=>u(!0),onMouseLeave:()=>u(!1),style:{height:`calc(100dvh - ${q?.current?.getBoundingClientRect()?.bottom}px)`},children:[e("div",{ref:Q,className:T("relative z-50",{"overflow-hidden":L!==H.Supports}),children:X}),e("div",{className:"flex-1 bg-transparent",onClick:O,role:"button",tabIndex:0,"aria-label":"Close menu",onKeyDown:t=>{(t.key==="Enter"||t.key===" "||t.key==="Escape")&&(t.preventDefault(),O())}})]}),B&&o("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:[e("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:N?.email?o(Pe,{children:[e(w,{html:N?.nick_name||_?.welcome,className:"text-sm font-bold"}),e("div",{className:"mt-2 h-px bg-[#D9D9D9]","aria-hidden":"true"}),e("nav",{className:"mt-2",role:"navigation","aria-label":"Profile navigation",children:_?.profiles?.map(t=>e(ce,{className:"py-2",label:t?.title,href:ie(t?.url,$)},t.id))})]}):o(Pe,{children:[e(Ae,{className:"absolute -top-2 right-[46px] z-30 text-white","aria-hidden":"true"}),e(w,{html:_?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),e("div",{className:"mt-2 flex flex-col gap-1",children:_?.benefits?.map(t=>o("div",{className:"flex items-center gap-[6px]",children:[e(me,{source:t.benefitIcon?.url,className:"size-4 shrink-0",alt:t.benefit,width:16,height:16}),e(w,{html:t.benefit,className:"text-sm font-bold leading-[1.4]"})]},t.id))}),o("div",{className:"mt-4 flex flex-wrap gap-2",children:[e(oe,{className:"grow",variant:"secondary",size:"lg",onClick:()=>c?.join?.(),children:e(w,{html:_?.primaryButton||"Join Now",className:"font-bold"})}),e(oe,{className:"grow",variant:"primary",size:"lg",onClick:()=>c?.login?.(),children:e(w,{html:_?.secondaryButton||"Log In",className:"font-bold"})})]})]})}),e("div",{className:"flex-1 bg-transparent",onClick:()=>R(!1),role:"button",tabIndex:0,"aria-label":"Close profile menu",onKeyDown:t=>{(t.key==="Enter"||t.key===" "||t.key==="Escape")&&(t.preventDefault(),R(!1))}})]})]})}),Ce=ae(({data:a,menuData:l,className:r,onPrimaryNavClick:s,onMobileMenuToggle:f},C)=>{const n=D(()=>ge(a?.categories?.filter(b=>b?.mobileShow)),[a]),{currentMenu:c,setCurrentMenu:N,subSubCategory:m}=te(),[u,$]=E(!1),[y,v]=E(0),[M,Y]=E(null),S=J(null),z=J(!1);G(()=>{if(S?.current&&u){const b=S?.current?.getBoundingClientRect();v(window?.innerHeight-(b?.top||0))}f?.({open:u})},[u,f]),G(()=>{if(!u)return;const b=ke(()=>{if(S?.current){const j=S.current.getBoundingClientRect();z.current=!0,v(window?.innerHeight-(j?.top||0))}},100);return window.addEventListener("resize",b),()=>window.removeEventListener("resize",b)},[u]),le(()=>{if(z.current){re.set(S.current,{height:y}),z.current=!1;return}re.fromTo(S.current,{height:0},{height:y,duration:.3})},[y]),se(u);const B=D(()=>M?.components?.[0]?.blockType,[M]),R=be(Ue,{categoriesItem:M}),q=fe(Fe,M),Q=he(_e,M),I=ve(Ge,M),d=D(()=>{switch(B){case H.Sidebar:return e(q,{});case H.Resource:return e(Q,{});case H.Supports:return e(R,{});case H.Multicol:return e(I,{});default:return null}},[B,M,R]),K=ne(()=>{$(!1),v(0),N&&N(W.Primary)},[$,v,N]),A=D(()=>a?.bar?.actions?.filter(b=>b?.mobileShow&&b?.blockType!==x.Profile),[a]),O=D(()=>a?.bar?.actions?.find(b=>b?.mobileShow&&b?.blockType===x.Profile)||{},[a]),L=D(()=>{switch(c){case W.Primary:return e(qe,{actions:A,menuOpen:u,onMenuOpenClose:()=>{$(!1),v(0)},onMenuOpenClick:()=>$(!0)});case W.Secondary:return e(Se,{title:M?.text,onMenuOpenClose:K,onMenuBackClick:()=>N?.(W.Primary)});case W.Third:return e(Se,{title:m?.label,onMenuOpenClose:K,onMenuBackClick:()=>N?.(W.Secondary)});default:return null}},[u,c,N,M,A,m,K]),V=ne((b,j)=>{const k=Array.isArray(n)?Array.isArray(n[b])?n[b][j]:{}:{};Y(k),k?.components?.[0]?.blockType===H.Links?k?.components?.[0]?.url&&window.open(k?.components?.[0]?.url,k?.components?.[0]?.target??"_blank"):N?.(W.Secondary)},[n,N]);return o(pe,{className:T("relative h-[56px]",r),children:[L,u&&o("nav",{ref:S,className:"absolute left-0 top-full z-[999] w-full overflow-y-auto border-t border-[#E4E5E6] bg-white text-black",style:{height:y},role:"navigation","aria-label":"Mobile navigation menu",children:[c===W.Primary&&l?e("div",{className:"pt-4",children:e(Te,{data:l})}):null,c===W.Primary?e(Je,{categories:n,onPrimaryMenuClick:V,onPrimaryNavClick:s,profileAction:O}):d]})]})}),Je=({categories:a,onPrimaryMenuClick:l,profileAction:r,onPrimaryNavClick:s})=>o("div",{className:"flex h-full flex-col justify-between",children:[e("div",{className:"tablet:px-8 laptop:px-16 p-4",children:a?.map((f,C)=>o("div",{className:"",children:[e("div",{className:T("my-2 h-px w-full bg-[#E5E5E7]")}),f?.map((n,c)=>e(ce,{label:n.text,onClick:()=>{const m=(a?.flat()||[])?.findIndex(u=>u?.id===a[C][c]?.id);l(C,c),s?.(n,m)},icon:n.components?.[0]?.icon},n.id))]},`groupCategory-${C}`))}),e(Ye,{profileAction:r})]}),Ye=({profileAction:a})=>{const[l,r]=E(!1),{profile:s,event:f}=te(),{locale:C="us"}=ue();return o("div",{className:T("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":l}),children:[o("button",{className:"flex w-full cursor-pointer items-center justify-between border-0 bg-transparent",onClick:()=>r(!l),"aria-expanded":l,"aria-label":s?.nick_name||a?.welcome,children:[o("div",{className:"flex items-center gap-[14px]",children:[e("div",{className:"flex size-[40px] shrink-0 items-center justify-center rounded-full bg-white",children:e(Re,{"aria-hidden":"true"})}),e(w,{html:s?.nick_name||a?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!s?.email&&e(Ne,{"aria-hidden":"true",className:T("laptop:size-4 size-5",{"rotate-180":l})})]}),s?.email&&e("nav",{className:"mt-4",role:"navigation","aria-label":"Profile menu",children:a?.profiles?.map(n=>e(ce,{label:n?.title,href:ie(n?.url,C)},n.id))}),l&&!s?.email&&o("div",{className:"mt-4",children:[e(w,{html:a?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),e("div",{className:"mt-2 flex flex-col gap-1",children:a?.benefits?.map(n=>o("div",{className:"flex items-center gap-[6px]",children:[e(me,{source:n.benefitIcon?.url,className:"size-4",alt:n.benefit,width:16,height:16}),e(w,{html:n.benefit,className:"text-sm font-bold leading-[1.4]"})]},n.id))})]}),!s?.email&&o("div",{className:"mt-4 flex items-center gap-3",children:[e(oe,{className:"tablet:flex-none flex-1",variant:"secondary",size:"base",onClick:()=>f?.join?.(),children:e(w,{html:a?.primaryButton||"Join Now",className:"text-sm font-bold leading-[1.4]"})}),e(oe,{className:"tablet:flex-none flex-1",variant:"primary",size:"base",onClick:()=>f?.login?.(),children:e(w,{html:a?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},qe=({menuOpen:a,onMenuOpenClose:l,onMenuOpenClick:r,actions:s})=>o("div",{className:"flex h-full items-center justify-between gap-4",children:[e(Me,{}),o("div",{className:"desktop:gap-6 flex items-center gap-4",children:[e(de,{actions:s}),a?e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>l(),"aria-label":"Close menu","aria-expanded":"true",children:e(ye,{className:"size-5","aria-hidden":"true"})}):e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Open menu","aria-expanded":"false","aria-haspopup":"true",children:e(Be,{className:"size-5","aria-hidden":"true"})})]})]}),Me=()=>{const{payloadData:a,isMobile:l}=te(),{locale:r="us"}=ue();return e("a",{href:ie("/",r),className:"hover:text-[#00CBEB] [&>svg]:w-full","aria-label":"Home",dangerouslySetInnerHTML:{__html:l?a?.bar?.mobileLogo:a?.bar?.desktopLogo}})},de=ae(({actions:a,activeStatus:l=!1},r)=>{const{event:s,cartCount:f}=te(),[C,n]=E(null),c=m=>{switch(m){case x.Search:return"Search";case x.Cart:return`Shopping cart${f>0?` (${f} items)`:""}`;case x.Profile:return"User profile";case x.Livestream:return"Livestream";default:return"Action"}},N=ne((m,u)=>{switch(n(u),m?.blockType){case x.Search:s?.search?.();break;case x.Cart:s?.cart?.();break;case x.Profile:s?.profile?.();break;case x.Livestream:s?.livestream?.();break;default:return()=>{}}},[s]);return e("div",{className:"desktop:gap-6 flex items-center gap-4",children:Array.isArray(a)&&a?.map((m,u)=>o("button",{className:"relative cursor-pointer border-0 bg-transparent p-0","data-tag":m?.tag||"",ref:m.blockType===x.Profile?r:null,onClick:()=>N(m,u),"aria-label":c(m.blockType),"aria-pressed":l&&C===u,children:[e(w,{html:m.icon,className:T("size-5",{"text-brand-0":l&&C===u}),"aria-hidden":"true"}),m.blockType===x.Cart&&f>0&&e("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:e(w,{html:f?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},m.id))})}),Se=({title:a,onMenuOpenClose:l,onMenuBackClick:r})=>o("div",{className:"flex h-full items-center gap-3",children:[e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Back to previous menu",children:e(Ie,{className:"size-5","aria-hidden":"true"})}),e(w,{html:a,className:"flex-1 text-center text-base font-bold leading-[1.4]"}),e("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>l(),"aria-label":"Close menu",children:e(ye,{className:"size-5","aria-hidden":"true"})})]});Ce.displayName="MobileNavigation",de.displayName="Actions",we.displayName="HeaderNavigation",xe.displayName="DesktopNavigation";var kt=He(we);export{kt as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as d}from"react/jsx-runtime";import ge,{useImperativeHandle as ve,useRef as g,useState as v,useEffect as Q}from"react";import{Heading as y,Picture as S,Text as M,Link as U}from"../../components/index.js";import{cn as r,getLocalizedPath as X}from"../../helpers/utils.js";import{withLayout as be}from"../../shared/Styles.js";import{useExposure as we}from"../../hooks/useExposure.js";import{useIntersectionObserverDelay as _e}from"../../hooks/useIntersectionObserver.js";import{useAiuiContext as ye}from"../AiuiProvider/index.js";import{motion as Y,AnimatePresence as ee}from"framer-motion";const ke="image",Ne="image_with_text",te=e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:e("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),ie=ge.forwardRef(({data:ae,className:oe},le)=>{const{title:b,subtitle:k,desc:f,descIcon:P,image:w,padImage:D,mobileImage:z,theme:se="dark",items:E=[],layout:re="left",mediaType:ne="image",datalist:s=[],video:H,padVideo:j,mobVideo:R,button:u,textAlign:l="left",titleTag:me}=ae,a=re,{locale:W="us"}=ye(),V=g(null),N=g(null),T=g(null),I=g(null),C=g(null),[c,de]=v(0),A=g([]),[q,ce]=v({left:0,width:0}),[h,$]=v(""),[B,F]=v(""),[O,Z]=v(""),n=s.length>0,_=ne==="video";we(V,{componentType:ke,componentName:Ne,componentTitle:b,componentDescription:k}),ve(le,()=>V.current),Q(()=>{if(s.length>0){const t=A.current[c];if(t){const{offsetLeft:o,offsetWidth:i}=t;ce({left:o,width:i})}}},[c,s.length]);const[G,pe]=v(!1);_e(C,{once:!0,threshold:.01,callback:()=>{pe(!0)}}),Q(()=>{if(!G||!_)return;let t="",o="",i="";if(n&&s[c]){const p=s[c];t=p.video?.url||"",o=p.padVideo?.url||t,i=p.mobVideo?.url||t}else t=H?.url||"",o=j?.url||t,i=R?.url||t;t&&$(t),o&&F(o),i&&Z(i),setTimeout(()=>{[N.current?.querySelector("video"),T.current?.querySelector("video"),I.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},200)},[G,_,n,c,s,H?.url,j?.url,R?.url]);const xe=(t,o)=>{if(de(t),o.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),_&&n&&s[t]){const i=s[t];i.video?.url&&$(i.video.url),i.padVideo?.url&&F(i.padVideo.url),i.mobVideo?.url&&Z(i.mobVideo.url),setTimeout(()=>{[N.current?.querySelector("video"),T.current?.querySelector("video"),I.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},300)}},ue=()=>!L||!u?.text||a==="bottom"?null:e("div",{className:r("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":l==="center","flex justify-start":l==="left"}),children:e(U,{href:X(u.link||"",W),className:"image-with-text__button whitespace-nowrap no-underline",suffixIcon:te,children:u.text})}),m=E.length>0,L=!!u,J=()=>{if(n&&s[c]){const t=s[c];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return w?`${w?.url},${D?.url||w?.url} 1024, ${z?.url||w?.url} 768`:""},K=()=>{if(n){const p=s[c],x=p.image?.url,fe=p.imgPad?.url||x,he=p.imageMob?.url||x;return e(ee,{mode:"wait",children:e(Y.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:d("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[e("div",{ref:N,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:x,src:h,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:T,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:fe,src:B||h,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:I,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:he,src:O||h,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},p.video?.url||p.image?.url)})}const t=w?.url,o=D?.url||t,i=z?.url||t;return d("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[e("div",{ref:N,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:h,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:T,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:o,src:B||h,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:I,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:i,src:O||h,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return d("section",{ref:V,"data-ui-component-id":"ImageWithText",className:r("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!n,"flex-col":!n&&a==="bottom","items-center":a==="left"||a==="right","flex-col laptop:flex-row":!n&&(a==="left"||a==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":n,"aiui-dark":se==="dark"},oe),children:[n&&(b||f||s.length>0)&&d("div",{className:r("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":l==="left","text-center":l==="center"}),children:[d("div",{className:"image-with-text__header",children:[e(y,{as:"h3",size:4,html:b,className:"image-with-text__title"}),e(M,{as:"p",size:1,html:f,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),e("div",{className:r("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":l==="center"}),children:d("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[e("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:q.left,width:q.width}}),s.map((t,o)=>e("div",{ref:i=>{A.current[o]=i},onClick:i=>xe(o,i),className:r("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",c===o?"image-with-text__tab--active text-black":"text-white"),children:e(y,{as:me??"h3",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},o))]})})]}),!n&&(b||k||f)&&d("div",{className:r("image-with-text__content flex w-full flex-col",{"justify-center":!L,"justify-between":L,"items-start":l==="left"&&m,"items-center":l==="center"&&m,"text-left":l==="left","text-center":l==="center","laptop:order-1":a==="left"}),children:[d("div",{className:r("image-with-text__main-content",{"flex flex-col":L}),children:[d("div",{className:r("image-with-text__header",{"laptop:flex laptop:items-end laptop:justify-between laptop:gap-16":a==="bottom"&&u?.text}),children:[d("div",{className:"image-with-text__title-wrapper flex min-w-0 flex-1 flex-col",children:[e(y,{as:"h2",size:4,html:b,className:r("image-with-text__title",{"text-left":m&&l==="left","text-center":m&&l==="center"})}),k&&e(M,{as:"p",size:m?4:3,html:k,className:r("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!m,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":m,"text-left":m&&l==="left","text-center":m&&l==="center"})})]}),a==="bottom"&&u?.text&&e(U,{href:X(u.link||"",W),className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:te,children:u.text})]}),!m&&(f||P)&&d("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[P&&e("img",{src:P,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),f&&e(y,{as:"h4",size:5,html:f,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),m&&e("div",{className:r("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":a==="bottom","grid-cols-2 tablet:grid-cols-4":a==="bottom","grid-cols-2 tablet:grid-cols-4 laptop:grid-cols-2":a==="left"||a==="right"}),children:E.map((t,o)=>d("div",{className:r("image-with-text__item",{"text-center":l==="center"}),children:[d("div",{className:r("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":l==="center","justify-start":l==="left"}),children:[t.icon?.url&&e(S,{source:t.icon.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),e(y,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),e(M,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},o))})]}),ue()]}),e("div",{ref:C,className:r("image-with-text__media-wrapper",{"laptop:w-[60%] w-full shrink-0":a==="left"||a==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":m,"laptop:basis-[63%] desktop:basis-[57%]":m&&a==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":n,"!max-w-none !max-h-none aspect-auto":a==="bottom"}),children:n?_?K():e(ee,{mode:"wait",children:e(Y.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:e(S,{source:J(),alt:s[c].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},s[c].image?.url)}):_?K():e(S,{source:J(),className:r("image-with-text__image rounded-box laptop:rounded-box")})})]})});ie.displayName="ImageWithText";var ze=be(ie);export{ze as default};
|
|
1
|
+
"use client";import{jsx as e,jsxs as d}from"react/jsx-runtime";import ge,{useImperativeHandle as ve,useRef as g,useState as v,useEffect as Q}from"react";import{Heading as y,Picture as S,Text as M,Link as U}from"../../components/index.js";import{cn as r,getLocalizedPath as X}from"../../helpers/utils.js";import{withLayout as be}from"../../shared/Styles.js";import{useExposure as we}from"../../hooks/useExposure.js";import{useIntersectionObserverDelay as _e}from"../../hooks/useIntersectionObserver.js";import{useAiuiContext as ye}from"../AiuiProvider/index.js";import{motion as Y,AnimatePresence as ee}from"framer-motion";const ke="image",Ne="image_with_text",te=e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:e("path",{d:"M6.91009 4.41058C7.23553 4.08514 7.76304 4.08514 8.08848 4.41058L13.0885 9.41058C13.4139 9.73602 13.4139 10.2635 13.0885 10.589L8.08848 15.589C7.76304 15.9144 7.23553 15.9144 6.91009 15.589C6.58466 15.2635 6.58466 14.736 6.91009 14.4106L11.3209 9.99977L6.91009 5.58897C6.58466 5.26353 6.58466 4.73602 6.91009 4.41058Z",fill:"currentColor"})}),ie=ge.forwardRef(({data:ae,className:oe},le)=>{const{title:b,subtitle:k,desc:f,descIcon:P,image:w,padImage:D,mobileImage:z,theme:se="dark",items:E=[],layout:re="left",mediaType:ne="image",datalist:s=[],video:H,padVideo:j,mobVideo:R,button:u,textAlign:l="left",titleTag:me}=ae,i=re,{locale:W="us"}=ye(),V=g(null),N=g(null),T=g(null),I=g(null),C=g(null),[p,de]=v(0),A=g([]),[q,pe]=v({left:0,width:0}),[h,$]=v(""),[B,F]=v(""),[O,Z]=v(""),n=s.length>0,_=ne==="video";we(V,{componentType:ke,componentName:Ne,componentTitle:b,componentDescription:k}),ve(le,()=>V.current),Q(()=>{if(s.length>0){const t=A.current[p];if(t){const{offsetLeft:o,offsetWidth:a}=t;pe({left:o,width:a})}}},[p,s.length]);const[G,ce]=v(!1);_e(C,{once:!0,threshold:.01,callback:()=>{ce(!0)}}),Q(()=>{if(!G||!_)return;let t="",o="",a="";if(n&&s[p]){const c=s[p];t=c.video?.url||"",o=c.padVideo?.url||t,a=c.mobVideo?.url||t}else t=H?.url||"",o=j?.url||t,a=R?.url||t;t&&$(t),o&&F(o),a&&Z(a),setTimeout(()=>{[N.current?.querySelector("video"),T.current?.querySelector("video"),I.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},200)},[G,_,n,p,s,H?.url,j?.url,R?.url]);const xe=(t,o)=>{if(de(t),o.target.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"}),_&&n&&s[t]){const a=s[t];a.video?.url&&$(a.video.url),a.padVideo?.url&&F(a.padVideo.url),a.mobVideo?.url&&Z(a.mobVideo.url),setTimeout(()=>{[N.current?.querySelector("video"),T.current?.querySelector("video"),I.current?.querySelector("video")].forEach(x=>{x&&(x.load(),x.play().catch(()=>{}))})},300)}},ue=()=>!L||!u?.text||i==="top"||i==="bottom"?null:e("div",{className:r("image-with-text__button-wrapper laptop:mt-[32px] mt-[24px]",{"flex justify-center":l==="center","flex justify-start":l==="left"}),children:e(U,{href:X(u.link||"",W),className:"image-with-text__button whitespace-nowrap no-underline",suffixIcon:te,children:u.text})}),m=E.length>0,L=!!u,J=()=>{if(n&&s[p]){const t=s[p];return`${t.image?.url} ,${t.imgPad?.url||t.image?.url} 1440, ${t.imageMob?.url||t.image?.url} 767`}return w?`${w?.url},${D?.url||w?.url} 1024, ${z?.url||w?.url} 768`:""},K=()=>{if(n){const c=s[p],x=c.image?.url,fe=c.imgPad?.url||x,he=c.imageMob?.url||x;return e(ee,{mode:"wait",children:e(Y.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__video-motion absolute left-0 top-0 w-full",children:d("div",{className:"image-with-text__video-wrapper rounded-box overflow-hidden",children:[e("div",{ref:N,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:x,src:h,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:T,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:fe,src:B||h,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:I,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:he,src:O||h,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})},c.video?.url||c.image?.url)})}const t=w?.url,o=D?.url||t,a=z?.url||t;return d("div",{className:"image-with-text__video-wrapper rounded-box laptop:rounded-box overflow-hidden",children:[e("div",{ref:N,className:"image-with-text__desktop-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:t,src:h,loop:!0,className:"image-with-text__video image-with-text__video--desktop lg-desktop:block hidden size-full object-cover"})}),e("div",{ref:T,className:"image-with-text__tablet-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:o,src:B||h,loop:!0,className:"image-with-text__video image-with-text__video--tablet tablet:block lg-desktop:hidden hidden"})}),e("div",{ref:I,className:"image-with-text__mobile-video-container",children:e("video",{playsInline:!0,autoPlay:!0,muted:!0,poster:a,src:O||h,loop:!0,className:"image-with-text__video image-with-text__video--mobile tablet:hidden block"})})]})};return d("section",{ref:V,"data-ui-component-id":"ImageWithText",className:r("image-with-text text-info-primary",{"flex gap-[24px] laptop:gap-[48px] lg-desktop:gap-[64px]":!n,"flex-col":!n&&(i==="top"||i==="bottom"),"items-center":i==="left"||i==="right","flex-col laptop:flex-row":!n&&(i==="left"||i==="right"),"flex l:gap-[24px] xl:flex-col min-md:justify-between min-l:gap-[20px]":n,"aiui-dark":se==="dark"},oe),children:[n&&(b||f||s.length>0)&&d("div",{className:r("image-with-text__tab-content min-md:gap-[24px] laptop:basis-[36%] inline-flex flex-col justify-center",{"text-left":l==="left","text-center":l==="center"}),children:[d("div",{className:"image-with-text__header",children:[e(y,{as:"h3",size:4,html:b,className:"image-with-text__title"}),e(M,{as:"p",size:1,html:f,className:"image-with-text__description tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]"})]}),e("div",{className:r("image-with-text__tabs-wrapper md:scrollbar-hidden relative md:overflow-hidden md:overflow-x-scroll",{"flex justify-center":l==="center"}),children:d("div",{className:"image-with-text__tabs rounded-btn relative inline-flex bg-[#1D1D1F] px-[4px] md:my-[24px]",children:[e("div",{className:"image-with-text__slider rounded-btn absolute inset-y-0 bg-white transition-all duration-300 ease-in-out",style:{left:q.left,width:q.width}}),s.map((t,o)=>e("div",{ref:a=>{A.current[o]=a},onClick:a=>xe(o,a),className:r("image-with-text__tab rounded-btn min-xxl:px-[28px] min-xxl:py-[15px] relative z-10 cursor-pointer px-[20px] py-[10px] text-center text-[12px] font-medium transition-colors duration-300 md:px-[20px] md:py-[10px]",p===o?"image-with-text__tab--active text-black":"text-white"),children:e(y,{as:me??"h3",size:1,html:t?.title,className:"image-with-text__tab-title text-balance-normal !whitespace-nowrap md:text-[14px]"})},o))]})})]}),!n&&(b||k||f)&&d("div",{className:r("image-with-text__content flex w-full flex-col",{"justify-center":!L,"justify-between":L,"items-start":l==="left"&&m,"items-center":l==="center"&&m,"text-left":l==="left","text-center":l==="center","laptop:order-1":i==="left"}),children:[d("div",{className:r("image-with-text__main-content",{"flex flex-col":L}),children:[d("div",{className:r("image-with-text__header",{"laptop:flex laptop:items-end laptop:justify-between laptop:gap-16":(i==="top"||i==="bottom")&&u?.text}),children:[d("div",{className:"image-with-text__title-wrapper flex min-w-0 flex-1 flex-col",children:[e(y,{as:"h2",size:4,html:b,className:r("image-with-text__title",{"text-left":m&&l==="left","text-center":m&&l==="center"})}),k&&e(M,{as:"p",size:m?4:3,html:k,className:r("image-with-text__subtitle tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[4px] text-[14px]",{"laptop:mt-[16px]":!m,"min-xxl:mt-[8px] laptop:text-[16px] lg-desktop:text-[18px]":m,"text-left":m&&l==="left","text-center":m&&l==="center"})})]}),(i==="top"||i==="bottom")&&u?.text&&e(U,{href:X(u.link||"",W),className:"laptop:flex hidden whitespace-nowrap no-underline",suffixIcon:te,children:u.text})]}),!m&&(f||P)&&d("div",{className:"image-with-text__description flex flex-row gap-[8px]",children:[P&&e("img",{src:P,alt:"icon",className:"image-with-text__description-icon desktop:size-[48px] size-[36px]"}),f&&e(y,{as:"h4",size:5,html:f,className:"image-with-text__description-text min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] text-[#3AD1FF] md:text-[40px]"})]}),m&&e("div",{className:r("image-with-text__items laptop:mt-[32px] desktop:mt-[48px] mt-[24px] grid w-full gap-6",{"!mt-6":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4":i==="top"||i==="bottom","grid-cols-2 tablet:grid-cols-4 laptop:grid-cols-2":i==="left"||i==="right"}),children:E.map((t,o)=>d("div",{className:r("image-with-text__item",{"text-center":l==="center"}),children:[d("div",{className:r("image-with-text__item-header flex flex-row items-center gap-[8px]",{"justify-center":l==="center","justify-start":l==="left"}),children:[t.icon?.url&&e(S,{source:t.icon.url,alt:t.icon?.alt,className:"image-with-text__item-icon min-md:text-[40px] min-l:text-[40px] min-xl:text-[56px] min-xxl:text-[64px] desktop:h-[44px] lg-desktop:h-[52px] h-[28px] translate-y-[-12%] md:text-[40px]",imgClassName:"h-full !w-full"}),e(y,{size:4,as:"h6",className:"image-with-text__item-text bg-gradient-to-r from-[#3ad1ff] to-[#008cd6] bg-clip-text text-transparent",children:t.text})]}),e(M,{size:4,as:"p",html:t.desc,className:"image-with-text__item-desc tablet:text-[14px] laptop:text-[14px] desktop:text-[16px] lg-desktop:text-[18px] mt-[-2px] text-[14px]"})]},o))})]}),ue()]}),e("div",{ref:C,className:r("image-with-text__media-wrapper",{"laptop:w-[60%] w-full shrink-0":i==="left"||i==="right","aspect-[716/720] max-h-[560px] max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[824/560] shrink-0":m,"laptop:basis-[63%] desktop:basis-[57%]":m&&i==="left","relative w-full shrink md:aspect-[358/360] min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] laptop:basis-[64%] desktop:aspect-[648/448]":n,"!max-w-none !max-h-none aspect-auto":i==="top"||i==="bottom"}),children:n?_?K():e(ee,{mode:"wait",children:e(Y.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.3},className:"image-with-text__image-motion absolute left-0 top-0 w-full",children:e(S,{source:J(),alt:s[p].image?.alt,className:"image-with-text__image rounded-box min-xxl:aspect-[824/560] min-xxl:max-w-[824px] tablet:aspect-[704/360] laptop:aspect-[744/336] desktop:aspect-[648/448] md:aspect-[358/360]"})},s[p].image?.url)}):_?K():e(S,{source:J(),className:r("image-with-text__image rounded-box laptop:rounded-box")})})]})});ie.displayName="ImageWithText";var ze=be(ie);export{ze as default};
|
|
@@ -45,7 +45,7 @@ export interface ImageWithTextTabItem {
|
|
|
45
45
|
title: string;
|
|
46
46
|
}
|
|
47
47
|
export type MediaType = 'image' | 'video';
|
|
48
|
-
export type LayoutPosition = 'left' | 'right' | 'bottom';
|
|
48
|
+
export type LayoutPosition = 'left' | 'right' | 'top' | 'bottom';
|
|
49
49
|
export type TextAlign = 'left' | 'center';
|
|
50
50
|
/** 列数枚举类型 */
|
|
51
51
|
export declare enum Cols {
|
|
@@ -68,7 +68,7 @@ export interface ImageWithTextProps {
|
|
|
68
68
|
descIcon?: string;
|
|
69
69
|
/** 主题，默认 dark */
|
|
70
70
|
theme?: Theme;
|
|
71
|
-
/** 布局位置，默认 left
|
|
71
|
+
/** 布局位置，默认 left。支持上下左右布局（left/right/top/bottom） */
|
|
72
72
|
layout?: LayoutPosition;
|
|
73
73
|
/** 媒体类型，默认 image。所有模式都支持 image 和 video */
|
|
74
74
|
mediaType?: MediaType;
|
|
@@ -24,11 +24,6 @@ export interface SecondaryBannerCarouselConfig {
|
|
|
24
24
|
export interface SecondaryBannerSlideData {
|
|
25
25
|
title?: string;
|
|
26
26
|
titleTag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
27
|
-
/**
|
|
28
|
-
* 是否将主标题渲染为 `<p>` 标签。为 true 时使用 Text 组件渲染，样式与 Heading 保持一致。
|
|
29
|
-
* @default false
|
|
30
|
-
*/
|
|
31
|
-
titleAsParagraph?: boolean;
|
|
32
27
|
superTitle?: string;
|
|
33
28
|
subtitle?: string;
|
|
34
29
|
size?: 'sm' | 'base' | 'lg' | 'xlg';
|
|
@@ -83,11 +78,6 @@ export interface SecondaryBannerData {
|
|
|
83
78
|
* @default 'h2'
|
|
84
79
|
*/
|
|
85
80
|
titleTag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
86
|
-
/**
|
|
87
|
-
* 是否将主标题渲染为 `<p>` 标签。为 true 时使用 Text 组件渲染，样式与 Heading 保持一致。
|
|
88
|
-
* @default false
|
|
89
|
-
*/
|
|
90
|
-
titleAsParagraph?: boolean;
|
|
91
81
|
/**
|
|
92
82
|
* 上标题/引导标题
|
|
93
83
|
* 通常用于分类、引导性文字
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as
|
|
1
|
+
"use client";import{jsx as t,jsxs as p}from"react/jsx-runtime";import*as T from"react";import{cva as F}from"class-variance-authority";import v from"jump.js";import{cn as n,getLocalizedPath as I}from"../../helpers/index.js";import{Text as S,Button as z,Heading as W,Picture as $,Countdown as q}from"../../components/index.js";import{withLayout as G}from"../../shared/Styles.js";import K from"../Media/index.js";import{useAiuiContext as Q}from"../AiuiProvider/index.js";import U from"./SecondaryBannerCarousel.js";const X=F("text-info-primary relative w-full",{variants:{size:{sm:"tablet:aspect-[768/480] laptop:aspect-[1920/480] desktop:aspect-[1920/480] lg-desktop:aspect-[1920/480] aspect-[390/480]",base:"tablet:aspect-[768/660] laptop:aspect-[1920/720] desktop:aspect-[1920/720] lg-desktop:aspect-[1920/720] aspect-[390/660]",lg:"tablet:aspect-[768/660] laptop:aspect-[1920/930] desktop:aspect-[1920/930] lg-desktop:aspect-[1920/930] aspect-[390/660]",xlg:"tablet:aspect-[768/660] laptop:aspect-[1920/930] desktop:aspect-[1920/930] lg-desktop:aspect-[1920/930] aspect-[390/660] overflow-visible"}},defaultVariants:{size:"base"}}),C=T.forwardRef(({className:u,classNames:a={},data:e,jumpOptions:g={},isActive:M,...b},y)=>{const{pcImage:D,padImage:N,mobileImage:L,isVideoLoop:A,endDate:f,endDate_tz:O,dateFormat:P,size:w,iconArray:c,theme:_,primaryButton:o,secondaryButton:i,title:j,titleTag:H}=e,V=A??!0,m=w??"base",E=_??"light",J=H??"h2",{locale:x="us"}=Q(),h={...{duration:500,offset:0},...g},d=T.useId(),l=j?`${d}-title`:void 0,k=e.subtitle?`${d}-subtitle`:void 0,B=e.superTitle?`${d}-super-title`:void 0,R=[B,k].filter(Boolean).join(" ")||void 0;return e.mode==="carousel"&&e.items&&e.items.length>0?t(U,{data:e,className:u,classNames:a,jumpOptions:g,ref:y,...b}):p("section",{ref:y,role:"banner","aria-labelledby":l,"aria-describedby":R,className:n({"aiui-dark":E==="dark"},X({size:m}),u,a?.root),...b,children:[t("div",{className:n("absolute inset-0",{"h-fit":m==="xlg"}),children:t(K,{pcImage:D,padImage:N,mobileImage:L,className:"size-full",imgClassName:"object-cover",videoClassName:"object-cover",muted:!0,loop:V,playsInline:!0,autoPlay:M??!0})}),p("div",{className:n("banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] absolute top-12 z-10 flex flex-col items-start justify-center px-[16px] text-left",a?.content),children:[p("div",{className:"banner-inner-title desktop:gap-2 flex flex-col items-start gap-1",children:[e.superTitle&&t(S,{as:"p",size:2,id:B,className:n("banner-super-title desktop:text-[16px] lg-desktop:text-[18px]",a?.superTitle),html:e.superTitle}),e.title&&t(W,{as:J,size:["xlg","lg"].includes(m)?5:4,id:l,className:n("banner-title ",a?.title),html:e.title}),e.subtitle&&t(S,{as:"p",size:3,id:k,className:n("banner-subtitle desktop:text-[16px] lg-desktop:text-[18px]",a?.subtitle),html:e.subtitle})]}),f&&t("div",{className:"banner-countdown",children:t(q,{endDate:f,endDate_tz:O,dateFormat:P,variant:"spacious",className:"lg-desktop:mt-8 mt-6"})}),p("div",{className:n("banner-cta-group lg-desktop:mt-[32px] lg-desktop:gap-3 mt-6 flex gap-2",a?.buttonGroup),children:[i?.text&&t(z,{variant:"secondary",onClick:r=>{if(i.link?.startsWith("#")){r.preventDefault();const s=document.querySelector(i.link);s&&v(s,h)}i.onClick?.()},className:n("",a?.secondaryButton),"aria-describedby":l,...i.link&&!i.link.startsWith("#")?{as:"a",href:I(i.link,x)}:{},children:i.text}),o?.text&&t(z,{onClick:r=>{if(o.link?.startsWith("#")){r.preventDefault();const s=document.querySelector(o.link);s&&v(s,h)}o.onClick?.()},className:n("",a?.primaryButton),"aria-describedby":l,...o.link&&!o.link.startsWith("#")?{as:"a",href:I(o.link,x)}:{},children:o.text})]}),Array.isArray(c)&&c.length>0&&t("div",{className:"banner-icons desktop:mt-3 lg-desktop:mt-4 mt-2 flex items-center gap-2",role:"group","aria-label":"brand icons",children:c.map((r,s)=>r.pcImage?t($,{source:r.pcImage.url,alt:r.pcImage.alt||`icon ${s+1}`,role:"img",className:"laptop:h-auto h-[48px] max-w-none",imgClassName:"h-full"},s):null)})]})]})});C.displayName="SecondaryBanner";var re=G(C);export{re as default,X as secondaryBannerVariants};
|
|
@@ -5,7 +5,6 @@ export type DropDownProps = {
|
|
|
5
5
|
setActive: any;
|
|
6
6
|
setVisible: any;
|
|
7
7
|
visible: any;
|
|
8
|
-
resolveName?: (item: any, sku?: string) => string;
|
|
9
8
|
};
|
|
10
|
-
declare const DropDown: ({ index, active, list, setActive, setVisible, visible
|
|
9
|
+
declare const DropDown: ({ index, active, list, setActive, setVisible, visible }: DropDownProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
10
|
export default DropDown;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
2
|
-
${e?.handle===a?.handle?"bg-[#EAEAEC]":""}`,children:
|
|
1
|
+
import{jsx as l}from"react/jsx-runtime";import{useEffect as i,useRef as p}from"react";const f="openDropDown",b=({index:n,active:a,list:d,setActive:u,setVisible:s,visible:t})=>{const c=p(null);return i(()=>{const e=o=>{const r=o?.target?.getAttribute?.("class");!c?.current?.contains(o?.target)&&!r?.includes(f)&&s({...t,[n]:!1})};return document.addEventListener("click",e),()=>document.removeEventListener("click",e)},[]),l("div",{ref:c,className:`absolute left-0 top-[104%] z-30 box-border max-h-[340px] w-full overflow-auto rounded-lg bg-white ${t?.[n]?"block":"hidden"}`,children:l("div",{className:"m-0 box-border h-full flex-1 overflow-hidden p-0 [&:last-child]:border-r-0",children:d?.map((e,o)=>{const r=e?.sku||e?.variants?.[0]?.sku;return l("div",{onClick:()=>{u({...a,[n]:{sku:r,name:e?.name||e?.title,handle:e?.handle}}),s({...t,[n]:!1})},title:e?.name||e?.title,className:`openDropDown min-xl:text-lg min-xxl:text-lg box-border cursor-pointer truncate px-6 py-4 text-base font-bold [&:hover]:bg-[#EAEAEC]
|
|
2
|
+
${e?.handle===a?.handle?"bg-[#EAEAEC]":""}`,children:e?.name||e?.title},o)})})})};var x=b;export{x as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{Fragment as
|
|
1
|
+
"use client";import{Fragment as F,jsx as t,jsxs as c}from"react/jsx-runtime";import G from"./dropdown.js";import{useAiuiContext as J}from"../AiuiProvider/index.js";import{useMediaQuery as K}from"react-responsive";import{useMemo as X,useState as b,useEffect as A}from"react";import{withLayout as Y}from"../../shared/Styles.js";import{formatVariantPrice as Z}from"../ShelfDisplay/shelfDisplay.js";import{Picture as k,Text as ee,Button as te,Heading as w}from"../../components/index.js";import{cn as se}from"../../helpers/index.js";import ne,{useImperativeHandle as oe,useRef as ae}from"react";const T=ne.forwardRef(({data:N,buildData:p,onChange:j,onSecondaryChange:le,className:H,...P},R)=>{const u=K({query:"(max-width: 768px)"}),[r,g]=b({}),[h,I]=b([]),[S,C]=b(!1),[v,L]=b({}),M=ae(null),{locale:_="us",currencyDisplay:$,trackingData:O,currencyCode:U}=J(),V=O?.showComparePrice??!0,{LeftMenu:D,RightMenu:y,DefaultSelectMenu:f}=X(()=>N?.data||{},[N?.data]),B=e=>{try{const n=new URL(e).pathname.toLowerCase();return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/.test(n)}catch{return/\.(jpeg|jpg|gif|png|webp|bmp|svg|tiff)$/i.test(e)}},z=(e,s)=>{const n=e?.variants?.find?.(i=>i?.sku===e?.sku),o=n?.coupons?.[0],{price:a,basePrice:l}=Z({locale:U==="CAD"?"us":_||"us",amount:o?o?.variant_price4wscode:n?.price,baseAmount:o?n?.price:0,currencyDisplay:$,currencyCode:e?.price?.currencyCode||"USD"}),d=typeof f?.buttonText=="string"?f?.buttonText:f?.buttonText?.[String(s)]||"";return c("div",{className:"specs-sku-node-wrap box-border",children:[c(ee,{className:"md-tablet:p-2 l-tablet:mb-4 l-tablet:text-sm desktop:px-6 lg-desktop:mb-8 lg-desktop:text-lg openDropDown specs-sku-node-text relative mb-6 box-border block rounded-[50px] border border-[#E4E5E6] bg-[#F5F5F7] px-6 py-4 text-base font-bold",onClick:()=>{if(h?.length<=1)return null;L({...v,[s]:!v?.[s]})},children:[c("div",{className:"flex items-center justify-between overflow-hidden",children:[t("div",{className:"openDropDown md-tablet:text-sm lg-desktop:text-lg specs-sku-node-title flex-1 truncate text-base",title:r?.[s]?.name||"",children:r?.[s]?.name||""}),h?.length>1?t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"25",viewBox:"0 0 24 25",fill:"none",className:"openDropDown",children:t("path",{d:"M6 9.5L12 15.5L18 9.5",stroke:"#1D1D1F",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}):null]}),t(G,{index:s,list:h,active:r,setActive:g,visible:v,setVisible:L})]}),t("div",{className:"lg-desktop:max-h-[196px] lg-desktop:max-w-[196px] max-h-[138px] max-w-[138px]",children:t(k,{source:n?.image?.url||"",className:"aspect-h-[280] aspect-w-[280]",imgClassName:"w-full h-full object-cover hover:scale-105 transition-all duration-300"})}),t("div",{className:"lg-desktop:text-2xl mb-2 mt-6 text-xl font-bold",children:t("div",{className:"lg-desktop:min-h-[32px] flex min-h-[28px] items-center",children:n?.availableForSale?c(F,{children:[t("div",{className:"specs-sku-node-price text-[#080A0F]",children:a||""}),V&&l&&t("div",{className:"lg-desktop:text-2xl specs-sku-node-base-price ml-1 text-xl text-[#86868C] line-through",children:l})]}):null})}),d?t(te,{onClick:()=>{j?.(e,s)},className:"specs-sku-node-button",children:d}):null]})},q=e=>e&&typeof e!="string"?c("div",{className:"size-full",children:[t("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:e?.text||""}}),t(k,{source:e?.imgUrl,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"})]}):t("div",{className:"break-all",children:B(e)?t(k,{source:e,className:"l:max-h-[174px] l:max-w-[174px] m-auto max-h-[360px] max-w-[360px]",imgClassName:"w-full h-full object-cover"}):t("p",{className:"min-xxl:text-lg specs-normal-node-text text-base font-bold text-[#080A0F] md:text-sm",dangerouslySetInnerHTML:{__html:e||""}})}),E=e=>e.map((s,n)=>{const o=n===0;return c("div",{className:"l-tablet:flex l-tablet:flex-col box-border grid w-full cursor-pointer grid-cols-3 overflow-hidden border-t border-t-[#E4E5E6] specs-product-node-wrap",children:[t(w,{as:"h3",html:s||"",className:"tablet:py-6 l-tablet:text-[#86868C] desktop:p-6 lg-desktop:text-lg specs-product-node-title mr-4 flex-1 pt-4 text-base font-bold md:text-sm"}),t("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:p-6 lg-desktop:gap-16 grid-cols-${S?3:2} specs-product-node-body col-span-2 grid flex-1 py-6`,children:Object.keys(r)?.map?.(a=>{const l=r?.[a],d=y?.menus?.find?.(i=>i?.handle===l?.handle)?.subTitle;return q(d?.[s])})})]},s)}),Q=e=>{if(!r)return;const{subTitle:s,isProduct:n}=e;return n?c(F,{children:[c("div",{className:"l-tablet:flex l-tablet:flex-col specs-content-item-product box-border grid w-full cursor-pointer grid-cols-3 border-t-0 border-t-[#E4E5E6]",children:[e?.title&&t(w,{as:"h3",html:e?.title||"",className:"l:hidden specs-item-product-title"}),t("div",{className:`l-tablet:w-full l-tablet:gap-4 laptop:gap-8 desktop:gap-12 desktop:px-6 desktop:pb-6 lg-desktop:gap-16 grid-cols-${S?3:2} specs-item-product-body col-span-2 grid flex-1 pb-4 pr-0`,children:Object.keys(r)?.map((o,a)=>{const l=r?.[o],d=p?.products?.find?.(i=>i?.handle===l?.handle);return t("div",{children:z({...d,item:o,sku:l?.sku},a)},o)})})]}),e?.categoryLabel&&t(w,{size:2,as:"h4",html:e?.categoryLabel||"",className:"desktop:p-6 specs-item-product-category py-6"}),s?.length?E(s):null]}):E(s)};return oe(R,()=>M.current),A(()=>{if(!p?.products?.length)return;const e=f?.sku?.split?.(",")||[],s=u&&e?.length>2?e?.slice(0,2):e;let n={};s?.forEach?.((a,l)=>{const i=y?.menus?.find?.(m=>m?.sku===a)?.handle,x=i?p?.products?.find?.(m=>m?.handle===i):p?.products?.find?.(m=>{if(m?.variants?.find?.(W=>W?.sku===a))return!0});x&&(n={...n,[l]:{sku:a,name:x?.name||x?.title,handle:i||x?.handle}})});const o=p?.products?.filter(a=>y?.menus?.find(l=>l?.handle===a?.handle));g(n),I(o),C(e?.length>2&&!u)},[p,u]),A(()=>{if(u){const e=Object.keys(r||{});if(e?.length>2){const s=e?.slice?.(0,2);let n={};s?.forEach?.(o=>{n={...n,[o]:r?.[o]}}),C(!1),g(n)}}},[u]),t("div",{...P,className:se("specs-wrapper w-full overflow-hidden bg-[#F5F5F7]",H),ref:M,children:D?.data?t("div",{className:"specs-wrapper-content box-border w-full overflow-hidden",children:D?.data?.map?.((e,s)=>t("div",{className:"specs-wrapper-content-item w-full overflow-hidden pt-10 [&:first-child]:pt-0",children:Q(e)},s))}):null})});T.displayName="Specs";var ge=Y(T);export{ge as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{Fragment as h,jsx as
|
|
1
|
+
"use client";import{Fragment as h,jsx as s,jsxs as C}from"react/jsx-runtime";import u from"react";import{Slot as x}from"@radix-ui/react-slot";import{cn as d}from"../helpers/index.js";import{cva as v}from"class-variance-authority";const P=v("tracking hover:text-brand-0 font-bold underline transition-colors",{variants:{size:{base:"text-text-2",lg:"text-text-3"},variant:{secondary:"text-info-secondary hover:text-info-primary",primary:"text-info-primary hover:text-brand-0"}}}),p=u.forwardRef(({children:o,size:m="base",variant:l="primary",className:c,asChild:r=!1,href:n,style:a,disabled:e=!1,suffixIcon:t,onClick:f,...y},k)=>s(r?x:"a",{ref:k,onClick:i=>{if(!e&&f?.(i),e||!n){i.preventDefault();return}},href:e?void 0:n,className:d(P({size:m,variant:l}),c,{"flex items-center":t,"cursor-pointer":!e,"text-info-quaternary cursor-not-allowed hover:text-info-quaternary":e}),...a?{style:a}:null,...y,children:r?o:C(h,{children:[o,t&&s("span",{className:"svg",children:t})]})}));p.displayName="Link";var V=p;export{V as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const f={us:"$",uk:"\xA3",ca:"$",eu:"\u20AC",fr:"\u20AC",de:"\u20AC",nl:"\u20AC",vn:"\u20AB",cl:"$",sg:"$",ae:"AED"},
|
|
1
|
+
const f={us:"$",uk:"\xA3",ca:"$",eu:"\u20AC",fr:"\u20AC",de:"\u20AC",nl:"\u20AC",vn:"\u20AB",cl:"$",sg:"$",ae:"AED"},s={us:"en-US",uk:"en-GB",ca:"en-CA",au:"AU","eu-en":"en","eu-fr":"fr-FR",fr:"FR","ca-fr":"FR","nl-fr":"FR",my:"MY",it:"IT",vn:"VN",es:"es-ES","eu-it":"it-IT","eu-de":"de-DE",de:"de-DE","eu-es":"es-ES","cz-en":"en-CZ",nl:"nl-NL","dk-en":"en-DK","gr-en":"en-GR","mk-en":"en-MK","hu-en":"en-HU","se-en":"en-SE","hr-en":"en-HR","bg-en":"en-BG","ee-en":"en-EE","fi-en":"en-FI","lt-en":"en-LT",pl:"pl-PL","ro-en":"en-RO","si-en":"en-SI","sk-en":"en-SK","no-en":"en-NO","ad-en":"en-AD","al-en":"en-AL","ba-en":"en-BA","me-en":"en-ME","rs-en":"en-RS","gl-en":"en-GL","is-en":"en-IS","ua-en":"en-UA","by-en":"en-BY","md-en":"en-MD","lv-en":"en-LV","at-de":"de-AT","lu-de":"de-LU","li-de":"de-LI","va-it":"it-VA","sm-it":"it-SM","be-nl":"nl-BE","ae-en":"en-AE",nz:"en-NZ","sg-en":"en-SG","sa-en":"en-SA","vn-vi":"vi-VN",ie:"en-IE",tw:"zh-TW"};let t={},c=s;const y=e=>{t={...t,...e},c={...s,...t}},g=e=>c[e]||"";function L({amount:e,currencyCode:l,locale:r,maximumFractionDigits:i,minimumFractionDigits:u,removeTrailingZeros:o=!1,currencyDisplay:d="symbol"}){const m=r==="nl"?"EUR":l||"USD",a=g(r);if(!a)return null;let n=new Intl.NumberFormat(a,{style:"currency",currency:m,currencyDisplay:d,minimumFractionDigits:i===0?0:u,maximumFractionDigits:i})?.format?.(e);return["eu-de","eu-en","de","eu"].includes(r)&&(n=n?.toString()?.replace?.(/[\s]/g,"")),o&&(n=n?.replace?.(/(\.\d*?[1-9])0+\b/,"$1")?.replace?.(/\.0+\b/,"")?.replace?.(/(,\d*?[1-9])0+\b/,"$1")?.replace?.(/,0+\b/,"")),n}export{f as PRICE_SYMBOL,y as extendLocaleMap,L as formatPrice,g as languageTerritory};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useRef as
|
|
1
|
+
import{useRef as R,useState as l,useEffect as L}from"react";function T(i={}){const{dragSpeed:v=1,enableMomentum:p=!0,dragElastic:D=.1}=i,o=R(null),[g,M]=l(!1),[u,f]=l(0),[m,b]=l(!1),[S,h]=l(!1),n=()=>{const r=o.current;if(!r)return;const{scrollLeft:e,scrollWidth:t,clientWidth:s}=r,a=t-s,d=a>0?e/a*100:0;f(Math.min(100,Math.max(0,d))),b(e>0),h(e<a-1)};L(()=>{const r=o.current;if(!r)return;n(),r.addEventListener("scroll",n);const e=new ResizeObserver(n);return e.observe(r),()=>{r.removeEventListener("scroll",n),e.disconnect()}},[]);const c=(r,e=!0)=>{const t=o.current;t&&t.scrollTo({left:r,behavior:e?"smooth":"auto"})};return{containerRef:o,isDragging:g,scrollProgress:u,canScrollLeft:m,canScrollRight:S,scrollTo:c,scrollLeft:(r=300)=>{const e=o.current;if(!e)return;const t=Math.max(0,e.scrollLeft-r);c(t)},scrollRight:(r=300)=>{const e=o.current;if(!e)return;const t=e.scrollWidth-e.clientWidth,s=Math.min(t,e.scrollLeft+r);c(s)}}}export{T as useDraggableScroll};
|
|
@@ -9,5 +9,5 @@ interface ExposureOptions {
|
|
|
9
9
|
pageGroup?: string;
|
|
10
10
|
position?: number;
|
|
11
11
|
}
|
|
12
|
-
export declare const useExposure: (ref: RefObject<HTMLElement
|
|
12
|
+
export declare const useExposure: (ref: RefObject<HTMLElement>, { componentType, componentName, componentTitle, componentDescription, navigation, position }: ExposureOptions) => void;
|
|
13
13
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useMemo as
|
|
1
|
+
import{useMemo as m}from"react";import{gaTrack as d}from"../shared/track.js";import{useIntersectionObserverDelay as f}from"./useIntersectionObserver.js";import{useAiuiContext as x}from"../biz-components/AiuiProvider/index.js";import{convertLexicalToPlaintext as l}from"@payloadcms/richtext-lexical/plaintext";const S=(u,{componentType:o,componentName:r,componentTitle:e,componentDescription:t,navigation:i="",position:a=1})=>{const{trackingData:g,onExposure:n}=x(),p=m(()=>typeof e=="object"&&e!==null?l({data:e}):e,[e]),s=m(()=>typeof t=="object"&&t!==null?l({data:t}):t,[t]);f(u,{once:!0,threshold:.5,delay:2e3,callback:()=>{const c=g.pageGroup||"Home Page";n?n({componentType:o,componentName:r,componentTitle:p,componentDescription:s,navigation:i,pageGroup:c,position:a}):d({event:"ga4Event",event_name:"component_impression",event_parameters:{page_group:c,component_type:o,component_name:r,position:a,creative_id:"",component_title:p,component_description:s,navigation:i}})}})};export{S as useExposure};
|
|
@@ -17,5 +17,5 @@ interface ViewItemListOptions {
|
|
|
17
17
|
index: number;
|
|
18
18
|
}>;
|
|
19
19
|
}
|
|
20
|
-
export declare const useViewItemList: (ref: RefObject<HTMLElement
|
|
20
|
+
export declare const useViewItemList: (ref: RefObject<HTMLElement>, { componentType, componentName, componentTitle, componentDescription, navigation, position, itemListName, items, tabName, }: ViewItemListOptions) => void;
|
|
21
21
|
export {};
|