npm - @anker-in/headless-ui - Versions diffs - 1.1.17 → 1.1.19 - Mend

@anker-in/headless-ui 1.1.17 → 1.1.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (78) hide show

package/dist/cjs/biz-components/AccordionCards/index.d.ts CHANGED Viewed

@@ -26,6 +26,23 @@ export type AccordionCardsType = {
         primaryButton?: string;
         theme?: 'light' | 'dark';
     };
+    /**
+     * 自动播放配置
+     */
+    autoplay?: {
+        /**
+         * 是否开启自动播放
+         */
+        enabled: boolean;
+        /**
+         * 是否循环播放
+         */
+        loop?: boolean;
+        /**
+         * 自动播放间隔时间，单位毫秒
+         */
+        interval?: number;
+    };
     /** 按钮事件*/
     event?: {
         primaryButton?: (_v: any, _index: number) => void;

package/dist/cjs/biz-components/AccordionCards/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var C=Object.create;var g=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var S=Object.getOwnPropertyNames;var A=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var z=(e,t)=>{for(var o in t)g(e,o,{get:t[o],enumerable:!0})},R=(e,t,o,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of S(t))!j.call(e,s)&&s!==o&&g(e,s,{get:()=>t[s],enumerable:!(p=D(t,s))||p.enumerable});return e};var f=(e,t,o)=>(o=e!=null?C(A(e)):{},R(t||!e||!e.__esModule?g(o,"default",{value:e,enumerable:!0}):o,e)),P=e=>R(g({},"__esModule",{value:!0}),e);var O={};z(O,{default:()=>q});module.exports=P(O);var i=require("react/jsx-runtime"),M=f(require("../Title/index.js")),l=require("../../helpers/utils.js"),$=f(require("../../components/picture.js")),N=f(require("../../components/button.js")),B=f(require("../SwiperBox/index.js")),E=require("../../shared/Styles.js"),n=f(require("react")),I=require("../../hooks/useExposure.js"),v=require("../../shared/trackUrlRef.js"),H=f(require("../../shared/throttle.js")),_=require("../../components/heading.js");const a="image",m="scene_banner",V=({item:e,idx:t,itemShape:o,hoverIndex:p,getRef:s,handleSwiperItemClick:h,isAnimation:b,contentWidth:c,primaryButton:u,event:w,data:T,accordionRef:y})=>{const x=p===t,k=x?8:1;return(0,I.useExposure)({current:y.current[t]},{componentType:a,componentName:m,componentTitle:e?.title,position:t+1,componentDescription:e?.subTitle}),(0,i.jsxs)("div",{style:{flex:`${k} 1 0%`,transition:"all 0.6s"},ref:r=>{r&&s(t,r)},className:(0,l.cn)("relative cursor-pointer overflow-hidden",o==="round"?"rounded-2xl":""),onMouseEnter:()=>h(t),onMouseLeave:()=>{b.current=!1},onClick:()=>{h(t)},children:[(0,i.jsx)("a",{href:(0,v.trackUrlRef)(e?.imgLink,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}`,children:(0,i.jsx)($.default,{source:e?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",alt:e?.img?.alt||""})}),(0,i.jsxs)("div",{style:{width:c},className:(0,l.cn)("absolute inset-x-0 bottom-0 flex w-full items-end justify-between overflow-hidden px-8 pb-8 opacity-0 transition-opacity duration-[600ms] ease-in",x&&c?"opacity-100":"opacity-0"),children:[(0,i.jsxs)("div",{className:"mr-16 flex-1 overflow-hidden",children:[(0,i.jsx)(_.Heading,{as:"h3",className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:e?.title}),(0,i.jsx)(_.Heading,{as:"h4",className:"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary line-clamp-2 text-[14px] font-[700]",children:e?.subTitle})]}),(0,i.jsxs)(N.default,{className:(0,l.cn)("mb-1.5 font-bold"),as:"a",href:(0,v.trackUrlRef)(e?.link,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}#${u}`,onClick:()=>w?.primaryButton?.(T,t),children:[u,(0,i.jsx)("span",{className:"sr-only",children:e?.title??e?.subTitle})]})]})]},t)},W=({data:e,configuration:t})=>{const o=(0,n.useRef)(null);return(0,I.useExposure)(o,{componentType:a,componentName:m,componentTitle:e?.title,position:t?.index+1,componentDescription:e?.subTitle}),(0,i.jsxs)("div",{ref:o,className:(0,l.cn)("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",t?.itemShape==="round"?"rounded-2xl":""),children:[(0,i.jsx)("a",{href:(0,v.trackUrlRef)(e?.imgLink,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-title-desc-button":`${e?.title}@${e?.subTitle}`,"data-headless-nav-postion":`''#${t?.index+1}`,children:(0,i.jsx)($.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:e?.mobileImg?.url||"",alt:e?.mobileImg?.alt||""})}),(0,i.jsxs)("div",{className:(0,l.cn)("absolute inset-x-0 bottom-0 overflow-hidden px-4 pb-4"),children:[(0,i.jsxs)("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[(0,i.jsx)("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:e?.title}),(0,i.jsx)("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),(0,i.jsx)(N.default,{as:"a",variant:"secondary","aria-label":e?.title??e?.subTitle,className:(0,l.cn)("text-info-primary text-sm font-bold"),href:(0,v.trackUrlRef)(e.link,`${a}_${m}`),"data-headless-type-name":`${a}#${m}`,"data-headless-nav-postion":`''#${t?.index+1}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}#${t?.primaryButton}`,children:t?.primaryButton})]})]})},L=n.default.forwardRef(({data:e,className:t="",event:o},p)=>{const[s,h]=(0,n.useState)(0),b=(0,n.useRef)(0),c=(0,n.useRef)([]),u=(0,n.useRef)(!1),[w,T]=(0,n.useState)(0),y=(0,n.useRef)(null);(0,n.useImperativeHandle)(p,()=>y.current);const x=(r,d)=>{d&&(c.current[r]=d)};(0,n.useEffect)(()=>{const r=()=>{c.current[b.current]&&T(c.current[b.current].offsetWidth)};r();const d=(0,H.default)(r,300);return window.addEventListener("resize",d),()=>window.removeEventListener("resize",d)},[]);const k=(0,n.useCallback)(r=>{s===r||u.current||(u.current=!0,h(r),b.current=r)},[e?.products,s]);return(0,i.jsxs)(i.Fragment,{children:[e?.title&&(0,i.jsx)(M.default,{data:{title:e?.title}}),(0,i.jsx)("div",{ref:y,className:(0,l.cn)("laptop:block hidden",{"aiui-dark":e?.theme==="dark"}),children:(0,i.jsx)("div",{className:(0,l.cn)("lg-desktop:h-[calc(560_/_1920*100vw)] desktop:h-[calc(448_/_1440*100vw)] laptop:h-[calc(336_/_1025*100vw)] flex max-h-[560px] min-h-[336px] w-full gap-4 overflow-hidden",t),children:e?.products?.map((r,d)=>(0,i.jsx)(V,{item:r,idx:d,itemShape:e?.itemShape,hoverIndex:s,getRef:x,handleSwiperItemClick:k,isAnimation:u,contentWidth:w,primaryButton:e?.primaryButton,event:o,data:e,accordionRef:c},d))})}),(0,i.jsx)("div",{className:(0,l.cn)("laptop:hidden block",{"aiui-dark":e?.theme==="dark"}),children:(0,i.jsx)(B.default,{className:(0,l.cn)("h-[400px] !overflow-visible",t),id:"AccordionCards"+e?.key,data:{list:e?.products,configuration:{shape:e?.shape,itemShape:e?.itemShape,primaryButton:e?.primaryButton,event:o,title:e?.title}},Slide:W,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3}}})})]})});L.displayName="AccordionCards";var q=(0,E.withLayout)(L);
+"use strict";"use client";var D=Object.create;var T=Object.defineProperty;var j=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var V=(e,t)=>{for(var i in t)T(e,i,{get:t[i],enumerable:!0})},E=(e,t,i,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let m of A(t))!P.call(e,m)&&m!==i&&T(e,m,{get:()=>t[m],enumerable:!(p=j(t,m))||p.enumerable});return e};var v=(e,t,i)=>(i=e!=null?D(z(e)):{},E(t||!e||!e.__esModule?T(i,"default",{value:e,enumerable:!0}):i,e)),W=e=>E(T({},"__esModule",{value:!0}),e);var U={};V(U,{default:()=>J});module.exports=W(U);var n=require("react/jsx-runtime"),M=v(require("../Title/index.js")),l=require("../../helpers/utils.js"),N=v(require("../../components/picture.js")),_=v(require("../../components/button.js")),H=v(require("../SwiperBox/index.js")),C=require("../../shared/Styles.js"),r=v(require("react")),R=require("../../hooks/useExposure.js"),g=require("../../shared/trackUrlRef.js"),S=v(require("../../shared/throttle.js")),B=require("../../components/heading.js");const a="image",d="scene_banner",q=({item:e,idx:t,itemShape:i,hoverIndex:p,getRef:m,handleSwiperItemClick:u,contentWidth:h,primaryButton:c,event:f,data:w,accordionRef:k})=>{const y=p===t,$=y?8:1;return(0,R.useExposure)({current:k.current[t]},{componentType:a,componentName:d,componentTitle:e?.title,position:t+1,componentDescription:e?.subTitle}),(0,n.jsxs)("div",{style:{flex:`${$} 1 0%`,transition:"all 0.6s"},ref:x=>{x&&m(t,x)},className:(0,l.cn)("relative cursor-pointer overflow-hidden",i==="round"?"rounded-2xl":""),onMouseEnter:()=>u(t),onClick:()=>{u(t)},children:[(0,n.jsx)("a",{href:(0,g.trackUrlRef)(e?.imgLink,`${a}_${d}`),"data-headless-type-name":`${a}#${d}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}`,children:(0,n.jsx)(N.default,{source:e?.img?.url,className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",alt:e?.img?.alt||""})}),(0,n.jsxs)("div",{style:{width:h},className:(0,l.cn)("absolute inset-x-0 bottom-0 flex w-full items-end justify-between overflow-hidden px-8 pb-8 opacity-0 transition-opacity duration-[600ms] ease-in",y&&h?"opacity-100":"opacity-0"),children:[(0,n.jsxs)("div",{className:"mr-16 flex-1 overflow-hidden",children:[(0,n.jsx)(B.Heading,{as:"h3",className:"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold",children:e?.title}),(0,n.jsx)(B.Heading,{as:"h4",className:"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary line-clamp-2 text-[14px] font-[700]",children:e?.subTitle})]}),c&&(0,n.jsxs)(_.default,{className:(0,l.cn)("mb-1.5 font-bold"),as:"a",href:(0,g.trackUrlRef)(e?.link,`${a}_${d}`),"data-headless-type-name":`${a}#${d}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}#${c}`,onClick:()=>f?.primaryButton?.(w,t),children:[c,(0,n.jsx)("span",{className:"sr-only",children:e?.title??e?.subTitle})]})]})]},t)},O=({data:e,configuration:t})=>{const i=(0,r.useRef)(null);return(0,R.useExposure)(i,{componentType:a,componentName:d,componentTitle:e?.title,position:t?.index+1,componentDescription:e?.subTitle}),(0,n.jsxs)("div",{ref:i,className:(0,l.cn)("bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid",t?.itemShape==="round"?"rounded-2xl":""),children:[(0,n.jsx)("a",{href:(0,g.trackUrlRef)(e?.imgLink,`${a}_${d}`),"data-headless-type-name":`${a}#${d}`,"data-headless-title-desc-button":`${e?.title}@${e?.subTitle}`,"data-headless-nav-postion":`''#${t?.index+1}`,children:(0,n.jsx)(N.default,{className:"size-full object-cover [&_img]:h-full [&_img]:object-cover",source:e?.mobileImg?.url||"",alt:e?.mobileImg?.alt||""})}),(0,n.jsxs)("div",{className:(0,l.cn)("absolute inset-x-0 bottom-0 overflow-hidden px-4 pb-4"),children:[(0,n.jsxs)("div",{className:"tablet:mb-6 mb-4 flex-1 overflow-hidden",children:[(0,n.jsx)("p",{className:"text-info-primary text-2xl font-bold leading-[1.2]",children:e?.title}),(0,n.jsx)("h3",{className:"text-info-primary line-clamp-2 text-sm font-semibold",children:e?.subTitle})]}),t?.primaryButton&&(0,n.jsx)(_.default,{as:"a",variant:"secondary","aria-label":e?.title??e?.subTitle,className:(0,l.cn)("text-info-primary text-sm font-bold"),href:(0,g.trackUrlRef)(e.link,`${a}_${d}`),"data-headless-type-name":`${a}#${d}`,"data-headless-nav-postion":`''#${t?.index+1}`,"data-headless-title-desc-button":`${e?.title}#${e?.subTitle}#${t?.primaryButton}`,children:t?.primaryButton})]})]})},L=r.default.forwardRef(({data:e,autoplay:t={enabled:!1,loop:!1,interval:1500},className:i="",event:p},m)=>{const[u,h]=(0,r.useState)(0),c=(0,r.useRef)(0),f=(0,r.useRef)([]),[w,k]=(0,r.useState)(0),y=(0,r.useRef)(null);(0,r.useImperativeHandle)(m,()=>y.current);const $=(o,s)=>{s&&(f.current[o]=s)};(0,r.useEffect)(()=>{const o=()=>{f.current[c.current]&&k(f.current[c.current].offsetWidth)};o();const s=(0,S.default)(o,300);return window.addEventListener("resize",s),()=>window.removeEventListener("resize",s)},[]);const x=(0,r.useCallback)(o=>{u!==o&&(h(o),c.current=o)},[e?.products,u]);return(0,r.useEffect)(()=>{let o;return t?.enabled&&(o=setInterval(()=>{h(s=>{const I=s??0;let b;if(t.loop!==!1)b=(I+1)%e?.products?.length;else if(b=I+1,b>=e?.products?.length)return b=e?.products?.length-1,o&&clearInterval(o),I;return c.current=b,b})},t?.interval)),()=>{o&&clearInterval(o)}},[t?.enabled,t?.interval,t?.loop,e?.products?.length,x]),(0,n.jsxs)(n.Fragment,{children:[e?.title&&(0,n.jsx)(M.default,{data:{title:e?.title}}),(0,n.jsx)("div",{ref:y,className:(0,l.cn)("laptop:block hidden",{"aiui-dark":e?.theme==="dark"}),children:(0,n.jsx)("div",{className:(0,l.cn)("lg-desktop:h-[calc(560_/_1920*100vw)] desktop:h-[calc(448_/_1440*100vw)] laptop:h-[calc(336_/_1025*100vw)] flex max-h-[560px] min-h-[336px] w-full gap-4 overflow-hidden",i),children:e?.products?.map((o,s)=>(0,n.jsx)(q,{item:o,idx:s,itemShape:e?.itemShape,hoverIndex:u,getRef:$,handleSwiperItemClick:x,contentWidth:w,primaryButton:e?.primaryButton,event:p,data:e,accordionRef:f},s))})}),(0,n.jsx)("div",{className:(0,l.cn)("laptop:hidden block",{"aiui-dark":e?.theme==="dark"}),children:(0,n.jsx)(H.default,{className:(0,l.cn)("h-[400px] !overflow-visible",i),id:"AccordionCards"+e?.key,data:{list:e?.products,configuration:{shape:e?.shape,itemShape:e?.itemShape,primaryButton:e?.primaryButton,event:p,title:e?.title}},Slide:O,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3}}})})]})});L.displayName="AccordionCards";var J=(0,C.withLayout)(L);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/AccordionCards/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/AccordionCards/index.tsx"],
-  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport React, { useState, useRef, useCallback, useImperativeHandle, useEffect, type RefObject } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { Img } from '../../types/props.js'\nimport throttle from '../../shared/throttle.js'\nimport { Heading } from '../../components/heading.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: Img\n  mobileImg?: Img\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n  imgLink?: string\n}\n\nexport type AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (_v: any, _index: number) => void\n  }\n}\n\nconst AccordionCardsPcItem = ({\n  item,\n  idx,\n  itemShape,\n  hoverIndex,\n  getRef,\n  handleSwiperItemClick,\n  isAnimation,\n  contentWidth,\n  primaryButton,\n  event,\n  data,\n  accordionRef,\n}: {\n  item: ItemType\n  idx: number\n  itemShape: 'round' | 'square' | undefined\n  hoverIndex: number | null\n  getRef: (_idx: number, _el: HTMLDivElement) => void\n  handleSwiperItemClick: (_idx: number) => void\n  isAnimation: any\n  contentWidth: number\n  primaryButton: string | undefined\n  event: any\n  data: AccordionCardsType['data']\n  accordionRef: React.MutableRefObject<HTMLDivElement[]>\n}) => {\n  const isExpanded = hoverIndex === idx\n  const flexValue = isExpanded ? 8 : 1\n\n  useExposure({ current: accordionRef.current[idx] } as RefObject<HTMLDivElement>, {\n    componentType,\n    componentName,\n    componentTitle: item?.title,\n    position: idx + 1,\n    componentDescription: item?.subTitle,\n  })\n\n  return (\n    <div\n      key={idx}\n      style={{\n        flex: `${flexValue} 1 0%`,\n        transition: 'all 0.6s',\n      }}\n      ref={(el: HTMLDivElement | null) => {\n        if (el) getRef(idx, el)\n      }}\n      className={cn('relative cursor-pointer overflow-hidden', itemShape === 'round' ? 'rounded-2xl' : '')}\n      onMouseEnter={() => handleSwiperItemClick(idx)}\n      onMouseLeave={() => {\n        isAnimation.current = false\n      }}\n      onClick={() => {\n        handleSwiperItemClick(idx)\n      }}\n    >\n      <a\n        href={trackUrlRef(item?.imgLink, `${componentType}_${componentName}`)}\n        data-headless-type-name={`${componentType}#${componentName}`}\n        data-headless-title-desc-button={`${item?.title}#${item?.subTitle}`}\n      >\n        <Picture\n          source={item?.img?.url}\n          className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n          alt={item?.img?.alt || ''}\n        />\n      </a>\n      <div\n        style={{\n          width: contentWidth,\n        }}\n        className={cn(\n          'absolute inset-x-0 bottom-0 flex w-full items-end justify-between overflow-hidden px-8 pb-8 opacity-0 transition-opacity duration-[600ms] ease-in',\n          isExpanded && contentWidth ? 'opacity-100' : 'opacity-0'\n        )}\n      >\n        <div className=\"mr-16 flex-1 overflow-hidden\">\n          <Heading as=\"h3\" className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n            {item?.title}\n          </Heading>\n          <Heading\n            as=\"h4\"\n            className=\"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary line-clamp-2 text-[14px] font-[700]\"\n          >\n            {item?.subTitle}\n          </Heading>\n        </div>\n        <Button\n          className={cn('mb-1.5 font-bold')}\n          as=\"a\"\n          href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n          data-headless-type-name={`${componentType}#${componentName}`}\n          data-headless-title-desc-button={`${item?.title}#${item?.subTitle}#${primaryButton}`}\n          onClick={() => event?.primaryButton?.(data, idx)}\n        >\n          {primaryButton}\n          <span className=\"sr-only\">{item?.title ?? item?.subTitle}</span>\n        </Button>\n      </div>\n    </div>\n  )\n}\n\nconst MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n    position: configuration?.index + 1,\n    componentDescription: data?.subTitle,\n  })\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n        configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n      )}\n    >\n      <a\n        href={trackUrlRef(data?.imgLink, `${componentType}_${componentName}`)}\n        data-headless-type-name={`${componentType}#${componentName}`}\n        data-headless-title-desc-button={`${data?.title}@${data?.subTitle}`}\n        data-headless-nav-postion={`''#${configuration?.index + 1}`}\n      >\n        <Picture\n          className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n          source={data?.mobileImg?.url || ''}\n          alt={data?.mobileImg?.alt || ''}\n        />\n      </a>\n      <div className={cn('absolute inset-x-0 bottom-0 overflow-hidden px-4 pb-4')}>\n        <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n          <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n          <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n        </div>\n\n        <Button\n          as=\"a\"\n          variant=\"secondary\"\n          aria-label={data?.title ?? data?.subTitle}\n          className={cn('text-info-primary text-sm font-bold')}\n          href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n          data-headless-type-name={`${componentType}#${componentName}`}\n          data-headless-nav-postion={`''#${configuration?.index + 1}`}\n          data-headless-title-desc-button={`${data?.title}#${data?.subTitle}#${configuration?.primaryButton}`}\n        >\n          {configuration?.primaryButton}\n        </Button>\n      </div>\n    </div>\n  )\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(({ data, className = '', event }, ref) => {\n  const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n\n  const hoverIndexRef = useRef<number>(0)\n  const accordionRef = useRef<HTMLDivElement[]>([])\n  const isAnimation = useRef<boolean>(false)\n  const [contentWidth, setContentWidth] = useState<number>(0)\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  const getRef = (index: number, el: HTMLDivElement) => {\n    if (el) {\n      accordionRef.current[index] = el\n    }\n  }\n\n  useEffect(() => {\n    const handleResize = () => {\n      if (accordionRef.current[hoverIndexRef.current]) {\n        setContentWidth(accordionRef.current[hoverIndexRef.current].offsetWidth)\n      }\n    }\n    handleResize()\n    const throttleResize = throttle(handleResize, 300)\n    window.addEventListener('resize', throttleResize)\n    return () => window.removeEventListener('resize', throttleResize)\n  }, [])\n\n  const handleSwiperItemClick = useCallback(\n    (idx: number) => {\n      if (hoverIndex === idx || isAnimation.current) return\n      isAnimation.current = true\n      // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n      setHoverIndex(idx)\n      hoverIndexRef.current = idx\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [data?.products, hoverIndex]\n  )\n\n  return (\n    <>\n      {data?.title && <Title data={{ title: data?.title }} />}\n      <div ref={innerRef} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n        <div\n          className={cn(\n            'lg-desktop:h-[calc(560_/_1920*100vw)] desktop:h-[calc(448_/_1440*100vw)] laptop:h-[calc(336_/_1025*100vw)] flex max-h-[560px] min-h-[336px] w-full gap-4 overflow-hidden',\n            className\n          )}\n        >\n          {data?.products?.map((item, idx) => (\n            <AccordionCardsPcItem\n              key={idx}\n              item={item}\n              idx={idx}\n              itemShape={data?.itemShape}\n              hoverIndex={hoverIndex}\n              getRef={getRef}\n              handleSwiperItemClick={handleSwiperItemClick}\n              isAnimation={isAnimation}\n              contentWidth={contentWidth}\n              primaryButton={data?.primaryButton}\n              event={event}\n              data={data}\n              accordionRef={accordionRef}\n            />\n          ))}\n        </div>\n      </div>\n      <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n        <SwiperBox\n          className={cn('h-[400px] !overflow-visible', className)}\n          id={'AccordionCards' + data?.key}\n          data={{\n            list: data?.products,\n            configuration: {\n              shape: data?.shape,\n              itemShape: data?.itemShape,\n              primaryButton: data?.primaryButton,\n              event: event,\n              title: data?.title,\n            },\n          }}\n          Slide={MobileItem}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1.2,\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n})\n\nAccordionCards.displayName = 'AccordionCards'\nexport default withLayout(AccordionCards)\n"],
-  "mappings": "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",
-  "names": ["AccordionCards_exports", "__export", "AccordionCards_default", "__toCommonJS", "import_jsx_runtime", "import_Title", "import_utils", "import_picture", "import_button", "import_SwiperBox", "import_Styles", "import_react", "import_useExposure", "import_trackUrlRef", "import_throttle", "import_heading", "componentType", "componentName", "AccordionCardsPcItem", "item", "idx", "itemShape", "hoverIndex", "getRef", "handleSwiperItemClick", "isAnimation", "contentWidth", "primaryButton", "event", "data", "accordionRef", "isExpanded", "flexValue", "el", "Picture", "Button", "MobileItem", "configuration", "ref", "AccordionCards", "React", "className", "setHoverIndex", "hoverIndexRef", "setContentWidth", "innerRef", "index", "handleResize", "throttleResize", "throttle", "Title", "SwiperBox"]
+  "sourcesContent": ["'use client'\nimport Title from '../Title/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport Button from '../../components/button.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport React, { useState, useRef, useCallback, useImperativeHandle, useEffect, type RefObject } from 'react'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { Img } from '../../types/props.js'\nimport throttle from '../../shared/throttle.js'\nimport { Heading } from '../../components/heading.js'\n\nconst componentType = 'image'\nconst componentName = 'scene_banner'\n\n/** Hook\uFF1A\u76D1\u542C\u7A97\u53E3\u5BBD\u5EA6 */\ntype ItemType = {\n  /** \u6807\u9898\u6587\u672C */\n  title: string\n  /** \u56FE\u7247*/\n  img: Img\n  mobileImg?: Img\n  /** \u5185\u5BB9\u8282\u70B9 */\n  subTitle: string\n  link?: string\n  imgLink?: string\n}\n\nexport type AccordionCardsType = {\n  className?: string\n  data: {\n    key?: string\n    title?: string\n    products: Array<ItemType>\n    /** \u6309\u94AE\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    /** \u5361\u7247\u5F62\u72B6 */\n    itemShape?: 'round' | 'square'\n    /** \u4E3B\u6309\u94AE\u914D\u7F6E */\n    primaryButton?: string\n    theme?: 'light' | 'dark'\n  }\n  /**\n   * \u81EA\u52A8\u64AD\u653E\u914D\u7F6E\n   */\n  autoplay?: {\n    /**\n     * \u662F\u5426\u5F00\u542F\u81EA\u52A8\u64AD\u653E\n     */\n    enabled: boolean\n    /**\n     * \u662F\u5426\u5FAA\u73AF\u64AD\u653E\n     */\n    loop?: boolean\n    /**\n     * \u81EA\u52A8\u64AD\u653E\u95F4\u9694\u65F6\u95F4\uFF0C\u5355\u4F4D\u6BEB\u79D2\n     */\n    interval?: number\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (_v: any, _index: number) => void\n  }\n}\n\nconst AccordionCardsPcItem = ({\n  item,\n  idx,\n  itemShape,\n  hoverIndex,\n  getRef,\n  handleSwiperItemClick,\n  contentWidth,\n  primaryButton,\n  event,\n  data,\n  accordionRef,\n}: {\n  item: ItemType\n  idx: number\n  itemShape: 'round' | 'square' | undefined\n  hoverIndex: number | null\n  getRef: (_idx: number, _el: HTMLDivElement) => void\n  handleSwiperItemClick: (_idx: number) => void\n  contentWidth: number\n  primaryButton: string | undefined\n  event: any\n  data: AccordionCardsType['data']\n  accordionRef: React.MutableRefObject<HTMLDivElement[]>\n}) => {\n  const isExpanded = hoverIndex === idx\n  const flexValue = isExpanded ? 8 : 1\n\n  useExposure({ current: accordionRef.current[idx] } as RefObject<HTMLDivElement>, {\n    componentType,\n    componentName,\n    componentTitle: item?.title,\n    position: idx + 1,\n    componentDescription: item?.subTitle,\n  })\n\n  return (\n    <div\n      key={idx}\n      style={{\n        flex: `${flexValue} 1 0%`,\n        transition: 'all 0.6s',\n      }}\n      ref={(el: HTMLDivElement | null) => {\n        if (el) getRef(idx, el)\n      }}\n      className={cn('relative cursor-pointer overflow-hidden', itemShape === 'round' ? 'rounded-2xl' : '')}\n      onMouseEnter={() => handleSwiperItemClick(idx)}\n      onClick={() => {\n        handleSwiperItemClick(idx)\n      }}\n    >\n      <a\n        href={trackUrlRef(item?.imgLink, `${componentType}_${componentName}`)}\n        data-headless-type-name={`${componentType}#${componentName}`}\n        data-headless-title-desc-button={`${item?.title}#${item?.subTitle}`}\n      >\n        <Picture\n          source={item?.img?.url}\n          className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n          alt={item?.img?.alt || ''}\n        />\n      </a>\n      <div\n        style={{\n          width: contentWidth,\n        }}\n        className={cn(\n          'absolute inset-x-0 bottom-0 flex w-full items-end justify-between overflow-hidden px-8 pb-8 opacity-0 transition-opacity duration-[600ms] ease-in',\n          isExpanded && contentWidth ? 'opacity-100' : 'opacity-0'\n        )}\n      >\n        <div className=\"mr-16 flex-1 overflow-hidden\">\n          <Heading as=\"h3\" className=\"laptop:text-2xl desktop:text-[32px] text-info-primary mb-1 text-xl font-bold\">\n            {item?.title}\n          </Heading>\n          <Heading\n            as=\"h4\"\n            className=\"lg-desktop:text-[18px] desktop:text-[16px] text-info-primary line-clamp-2 text-[14px] font-[700]\"\n          >\n            {item?.subTitle}\n          </Heading>\n        </div>\n        {primaryButton && (\n          <Button\n            className={cn('mb-1.5 font-bold')}\n            as=\"a\"\n            href={trackUrlRef(item?.link, `${componentType}_${componentName}`)}\n            data-headless-type-name={`${componentType}#${componentName}`}\n            data-headless-title-desc-button={`${item?.title}#${item?.subTitle}#${primaryButton}`}\n            onClick={() => event?.primaryButton?.(data, idx)}\n          >\n            {primaryButton}\n            <span className=\"sr-only\">{item?.title ?? item?.subTitle}</span>\n          </Button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nconst MobileItem = ({ data, configuration }: { data: ItemType; configuration?: any }) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.title,\n    position: configuration?.index + 1,\n    componentDescription: data?.subTitle,\n  })\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'bg-container-secondary-1 relative w-full shrink-0 grow-0 overflow-hidden border border-solid',\n        configuration?.itemShape === 'round' ? 'rounded-2xl' : ''\n      )}\n    >\n      <a\n        href={trackUrlRef(data?.imgLink, `${componentType}_${componentName}`)}\n        data-headless-type-name={`${componentType}#${componentName}`}\n        data-headless-title-desc-button={`${data?.title}@${data?.subTitle}`}\n        data-headless-nav-postion={`''#${configuration?.index + 1}`}\n      >\n        <Picture\n          className=\"size-full object-cover [&_img]:h-full [&_img]:object-cover\"\n          source={data?.mobileImg?.url || ''}\n          alt={data?.mobileImg?.alt || ''}\n        />\n      </a>\n      <div className={cn('absolute inset-x-0 bottom-0 overflow-hidden px-4 pb-4')}>\n        <div className=\"tablet:mb-6 mb-4 flex-1 overflow-hidden\">\n          <p className=\"text-info-primary text-2xl font-bold leading-[1.2]\">{data?.title}</p>\n          <h3 className=\"text-info-primary line-clamp-2 text-sm font-semibold\">{data?.subTitle}</h3>\n        </div>\n\n        {configuration?.primaryButton && (\n          <Button\n            as=\"a\"\n            variant=\"secondary\"\n            aria-label={data?.title ?? data?.subTitle}\n            className={cn('text-info-primary text-sm font-bold')}\n            href={trackUrlRef(data.link, `${componentType}_${componentName}`)}\n            data-headless-type-name={`${componentType}#${componentName}`}\n            data-headless-nav-postion={`''#${configuration?.index + 1}`}\n            data-headless-title-desc-button={`${data?.title}#${data?.subTitle}#${configuration?.primaryButton}`}\n          >\n            {configuration?.primaryButton}\n          </Button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nconst AccordionCards = React.forwardRef<HTMLDivElement, AccordionCardsType>(\n  ({ data, autoplay = { enabled: false, loop: false, interval: 1500 }, className = '', event }, ref) => {\n    const [hoverIndex, setHoverIndex] = useState<number | null>(0)\n\n    const hoverIndexRef = useRef<number>(0)\n    const accordionRef = useRef<HTMLDivElement[]>([])\n    const [contentWidth, setContentWidth] = useState<number>(0)\n\n    const innerRef = useRef<HTMLDivElement>(null)\n    useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n    const getRef = (index: number, el: HTMLDivElement) => {\n      if (el) {\n        accordionRef.current[index] = el\n      }\n    }\n\n    useEffect(() => {\n      const handleResize = () => {\n        if (accordionRef.current[hoverIndexRef.current]) {\n          setContentWidth(accordionRef.current[hoverIndexRef.current].offsetWidth)\n        }\n      }\n      handleResize()\n      const throttleResize = throttle(handleResize, 300)\n      window.addEventListener('resize', throttleResize)\n      return () => window.removeEventListener('resize', throttleResize)\n    }, [])\n\n    const handleSwiperItemClick = useCallback(\n      (idx: number) => {\n        if (hoverIndex === idx) return\n        // \u66F4\u65B0\u5BBD\u5EA6\u76F8\u5173\u72B6\u6001\n        setHoverIndex(idx)\n        hoverIndexRef.current = idx\n      },\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      [data?.products, hoverIndex]\n    )\n\n    useEffect(() => {\n      let autoPlayTimer: NodeJS.Timeout\n      if (autoplay?.enabled) {\n        autoPlayTimer = setInterval(() => {\n          setHoverIndex(prev => {\n            const currentIndex = prev ?? 0\n            let nextIndex: number\n\n            if (autoplay.loop !== false) {\n              // \u9ED8\u8BA4\u5FAA\u73AF\u64AD\u653E\n              nextIndex = (currentIndex + 1) % data?.products?.length\n            } else {\n              // \u4E0D\u5FAA\u73AF\uFF1A\u64AD\u653E\u5230\u6700\u540E\u4E00\u4E2A\u540E\u505C\u6B62\n              nextIndex = currentIndex + 1\n              if (nextIndex >= data?.products?.length) {\n                nextIndex = data?.products?.length - 1\n                // \u505C\u6B62\u81EA\u52A8\u64AD\u653E\n                if (autoPlayTimer) {\n                  clearInterval(autoPlayTimer)\n                }\n                return currentIndex // \u4FDD\u6301\u5728\u6700\u540E\u4E00\u4E2A\n              }\n            }\n\n            hoverIndexRef.current = nextIndex\n            return nextIndex\n          })\n        }, autoplay?.interval)\n      }\n      return () => {\n        if (autoPlayTimer) {\n          clearInterval(autoPlayTimer)\n        }\n      }\n    }, [autoplay?.enabled, autoplay?.interval, autoplay?.loop, data?.products?.length, handleSwiperItemClick])\n\n    return (\n      <>\n        {data?.title && <Title data={{ title: data?.title }} />}\n        <div ref={innerRef} className={cn('laptop:block hidden', { 'aiui-dark': data?.theme === 'dark' })}>\n          <div\n            className={cn(\n              'lg-desktop:h-[calc(560_/_1920*100vw)] desktop:h-[calc(448_/_1440*100vw)] laptop:h-[calc(336_/_1025*100vw)] flex max-h-[560px] min-h-[336px] w-full gap-4 overflow-hidden',\n              className\n            )}\n          >\n            {data?.products?.map((item, idx) => (\n              <AccordionCardsPcItem\n                key={idx}\n                item={item}\n                idx={idx}\n                itemShape={data?.itemShape}\n                hoverIndex={hoverIndex}\n                getRef={getRef}\n                handleSwiperItemClick={handleSwiperItemClick}\n                contentWidth={contentWidth}\n                primaryButton={data?.primaryButton}\n                event={event}\n                data={data}\n                accordionRef={accordionRef}\n              />\n            ))}\n          </div>\n        </div>\n        <div className={cn('laptop:hidden block', { 'aiui-dark': data?.theme === 'dark' })}>\n          <SwiperBox\n            className={cn('h-[400px] !overflow-visible', className)}\n            id={'AccordionCards' + data?.key}\n            data={{\n              list: data?.products,\n              configuration: {\n                shape: data?.shape,\n                itemShape: data?.itemShape,\n                primaryButton: data?.primaryButton,\n                event: event,\n                title: data?.title,\n              },\n            }}\n            Slide={MobileItem}\n            breakpoints={{\n              0: {\n                spaceBetween: 12,\n                freeMode: false,\n                slidesPerView: 1,\n              },\n              374: {\n                spaceBetween: 12,\n                freeMode: false,\n                slidesPerView: 1.2,\n              },\n              768: {\n                spaceBetween: 16,\n                freeMode: false,\n                slidesPerView: 2.3,\n              },\n            }}\n          />\n        </div>\n      </>\n    )\n  }\n)\n\nAccordionCards.displayName = 'AccordionCards'\nexport default withLayout(AccordionCards)\n"],
+  "mappings": "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",
+  "names": ["AccordionCards_exports", "__export", "AccordionCards_default", "__toCommonJS", "import_jsx_runtime", "import_Title", "import_utils", "import_picture", "import_button", "import_SwiperBox", "import_Styles", "import_react", "import_useExposure", "import_trackUrlRef", "import_throttle", "import_heading", "componentType", "componentName", "AccordionCardsPcItem", "item", "idx", "itemShape", "hoverIndex", "getRef", "handleSwiperItemClick", "contentWidth", "primaryButton", "event", "data", "accordionRef", "isExpanded", "flexValue", "el", "Picture", "Button", "MobileItem", "configuration", "ref", "AccordionCards", "React", "autoplay", "className", "setHoverIndex", "hoverIndexRef", "setContentWidth", "innerRef", "index", "handleResize", "throttleResize", "throttle", "autoPlayTimer", "prev", "currentIndex", "nextIndex", "Title", "SwiperBox"]
 }

package/dist/cjs/biz-components/FooterNavigation/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var B=Object.create;var k=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var D=(t,l)=>{for(var i in l)k(t,i,{get:l[i],enumerable:!0})},b=(t,l,i,a)=>{if(l&&typeof l=="object"||typeof l=="function")for(let o of C(l))!A.call(t,o)&&o!==i&&k(t,o,{get:()=>l[o],enumerable:!(a=M(l,o))||a.enumerable});return t};var L=(t,l,i)=>(i=t!=null?B(F(t)):{},b(l||!t||!t.__esModule?k(i,"default",{value:t,enumerable:!0}):i,t)),E=t=>b(k({},"__esModule",{value:!0}),t);var j={};D(j,{default:()=>O});module.exports=E(j);var e=require("react/jsx-runtime"),c=require("react"),s=require("../../components/index.js"),y=L(require("../Subscribe/index.js")),h=require("./types.js"),x=require("./icons/index.js"),v=require("react-responsive"),f=require("../../helpers/utils.js"),w=require("../../shared/Styles.js");const S=({data:{footerNavigation:t}={},currentCountry:l,event:i,subscribeLoading:a})=>{const[o,m]=(0,c.useState)(!1),p=(0,v.useMediaQuery)({query:"(max-width: 1439px)"});(0,c.useEffect)(()=>{m(p)},[p]);const r=(0,c.useMemo)(()=>t?.footerBlocks?.find(d=>d?.blockType===h.FooterNavigationBlockType.Brand)?.country||{},[t]);return(0,e.jsxs)(s.Container,{childClassName:"bg-black py-8 laptop:py-16 flex flex-col desktop:gap-16 gap-8",children:[(0,e.jsx)(s.Text,{html:t?.story,className:"desktop:text-sm text-xs font-bold text-[#6D6D6F]"}),t?.footerBlocks?.map(d=>{if(d?.blockType===h.FooterNavigationBlockType.Signup)return(0,e.jsx)(T,{subscribeLoading:a,data:d,onSubmit:i?.signup},d.id);if(d?.blockType===h.FooterNavigationBlockType.Brand)return(0,e.jsx)(z,{data:d,isMobile:o,event:i,currentCountry:l},d?.id);if(d?.blockType===h.FooterNavigationBlockType.Main)return(0,e.jsx)($,{data:{...d,country:r},event:i,isMobile:o,currentCountry:l},d.id)})]})},T=({data:t,onSubmit:l,subscribeLoading:i})=>(0,e.jsxs)("div",{className:"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#080A0F] px-4 py-8",children:[(0,e.jsx)(y.default,{subscribeMetadata:t?.signup,className:"desktop:flex-[744]",onSubmit:l,loading:i}),(0,e.jsx)("div",{className:"desktop:hidden h-px w-full bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.enjoy?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.enjoy?.enjoys?.map(a=>(0,e.jsxs)("div",{className:"flex-start flex gap-2",children:[(0,e.jsx)(s.Picture,{source:a?.icon?.url,alt:a?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Text,{html:a?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})]},a?.id))})]}),(0,e.jsx)("div",{className:"desktop:block hidden w-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.benefit?.title,className:"text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.benefit?.benefits?.map(a=>(0,e.jsx)(s.Link,{href:`${a?.link}?ref=footer`,asChild:!a?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:a?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},a?.id))})]})]})]}),$=({data:t,event:l,isMobile:i,currentCountry:a})=>{const[o,m]=(0,c.useState)(!1),{services:p,mainNav:r,country:d}=t;return(0,e.jsxs)("div",{className:"flex flex-col gap-8",children:[(0,e.jsxs)("div",{className:(0,f.cn)({"desktop:gap-16 flex":p?.download?.title}),children:[(0,e.jsxs)("div",{className:(0,f.cn)("w-full",{"desktop:flex-[1260]":p?.download?.title}),children:[(0,e.jsx)(s.Text,{html:p?.storeBenefits?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:(0,f.cn)("laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2",{"desktop:max-w-[648px]":p?.download?.title}),children:p?.storeBenefits?.reasons?.map(n=>(0,e.jsxs)("div",{className:"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2",children:[(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,asChild:!n?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:n?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})})]},n?.id))})]}),(0,e.jsx)(N,{className:(0,f.cn)({"desktop:flex-[404] hidden desktop:block":p?.download?.title}),title:p?.download?.title,apps:p?.download?.apps})]}),(0,e.jsx)("div",{className:"desktop:block hidden h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:grid grid-cols-4 gap-4",children:[(0,e.jsx)(u,{title:r?.products?.title,lists:r?.products?.products}),(0,e.jsx)(u,{title:r?.explore?.title,lists:r?.explore?.explores}),(0,e.jsx)(u,{title:r?.support?.title,lists:r?.support?.supports}),(0,e.jsxs)("div",{className:"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4",children:[(0,e.jsxs)("div",{className:"desktop:pb-0 flex items-center justify-between pb-4",children:[(0,e.jsx)(s.Text,{as:"p",html:r?.contact?.title,className:"text-xl font-bold leading-[1.2] text-white"}),i&&(0,e.jsx)("button",{onClick:()=>m(!o),children:o?(0,e.jsx)(x.SubtractIcon,{width:20,height:20}):(0,e.jsx)(x.AddIcon,{width:20,height:20})})]}),(o&&i||!i)&&(0,e.jsx)("div",{className:"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2",children:r?.contact?.contacts?.map(n=>(0,e.jsxs)("div",{className:"flex items-start gap-2",children:[(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:n?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:n?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})})]},n?.id))}),(0,e.jsx)(g,{country:a||d,className:"desktop:hidden border-b border-[#3D3E3F]",isMobile:i,onChangeCountry:l?.country}),(0,e.jsx)("div",{className:"desktop:hidden mt-8",children:(0,e.jsx)(N,{title:p?.download?.title,apps:p?.download?.apps})}),!!r?.socials?.length&&(0,e.jsx)("div",{className:"mt-8 flex items-center gap-2",children:r?.socials?.map(n=>(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,children:(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-8 shrink-0"})},n?.id))}),(0,e.jsx)("div",{className:"mt-4 flex flex-wrap gap-2",children:r?.payment?.map(n=>(0,e.jsx)(s.Link,{href:n?.link,children:(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"h-[28px] w-[44px] shrink-0"})},n?.id))})]})]})]})},z=({data:t,isMobile:l,event:i,currentCountry:a})=>(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"desktop:items-center desktop:flex desktop:gap-4",children:[(0,e.jsxs)("div",{className:"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4",children:[(0,e.jsx)(s.Text,{html:t?.brand?.currentBrand,className:"text-[#B6B6BA]"}),(0,e.jsx)("div",{className:"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]"}),(0,e.jsx)("div",{className:"desktop:gap-6 flex flex-wrap items-center gap-4",children:t?.brand?.brands?.map(o=>(0,e.jsx)(s.Link,{href:`${o?.link}?ref=footer`,children:(0,e.jsx)(s.Text,{html:o?.icon,className:"text-[#B6B6BA] hover:text-white"})},o?.id))})]}),(0,e.jsx)(g,{country:a||t?.country,className:"desktop:flex-[316] desktop:block hidden",isMobile:l,onChangeCountry:i?.country})]}),(0,e.jsx)("div",{className:"h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1",children:[(0,e.jsx)(s.Text,{html:t?.copyright?.label,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsx)("div",{className:"flex flex-wrap items-center gap-x-2 gap-y-1",children:t?.policy?.policies?.map(o=>(0,e.jsx)(s.Link,{href:`${o?.link}?ref=footer`,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white",children:o?.label},o?.id))})]})]}),u=({title:t,lists:l,className:i})=>{const[a,o]=(0,c.useState)(!1),[m,p]=(0,c.useState)(!1),r=(0,v.useMediaQuery)({query:"(max-width: 1439px)"});return(0,c.useEffect)(()=>{p(r)},[r]),(0,e.jsxs)("div",{className:(0,f.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",i),children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",onClick:()=>o(!a),children:[(0,e.jsx)(s.Text,{as:"p",html:t,className:"text-xl font-bold leading-[1.2] text-white"}),m&&(0,e.jsx)(e.Fragment,{children:a?(0,e.jsx)(x.SubtractIcon,{width:20,height:20}):(0,e.jsx)(x.AddIcon,{width:20,height:20})})]}),(a&&m||!m)&&(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:l?.map(d=>(0,e.jsx)(s.Link,{href:`${d?.link}?ref=footer`,className:"no-underline",children:(0,e.jsx)(s.Text,{html:d?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},d?.id))})]})},N=({title:t,apps:l,className:i})=>l?.length?(0,e.jsxs)("div",{className:i,children:[(0,e.jsx)(s.Text,{html:t,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex items-center gap-4",children:l?.map(a=>(0,e.jsxs)("div",{className:"flex flex-col items-center gap-[6px]",children:[(0,e.jsx)(s.Link,{href:a?.link,children:(0,e.jsx)(s.Picture,{source:a?.icon?.url,alt:a?.icon?.alt,className:"size-10 shrink-0"})}),a?.label&&(0,e.jsx)(s.Text,{html:a?.label,className:"text-xs font-bold  text-[#999999]"})]},a?.id))})]}):null,g=({country:t,isMobile:l,className:i,onChangeCountry:a})=>(0,e.jsx)("div",{className:(0,f.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",i),onClick:()=>a?.(),children:(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex cursor-pointer items-center gap-2",children:[(0,e.jsx)(x.CountryIcon,{width:20,height:20,className:"shrink-0"}),(0,e.jsx)(s.Text,{as:"p",html:t?.countryName||t?.country,className:"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white"})]}),l&&(0,e.jsx)("button",{children:(0,e.jsx)(x.ArrowRightIcon,{width:20,height:20})})]})});var O=(0,w.withLayout)(S);
+"use strict";var B=Object.create;var h=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,A=Object.prototype.hasOwnProperty;var D=(t,o)=>{for(var i in o)h(t,i,{get:o[i],enumerable:!0})},v=(t,o,i,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let n of C(o))!A.call(t,n)&&n!==i&&h(t,n,{get:()=>o[n],enumerable:!(l=M(o,n))||l.enumerable});return t};var L=(t,o,i)=>(i=t!=null?B(F(t)):{},v(o||!t||!t.__esModule?h(i,"default",{value:t,enumerable:!0}):i,t)),E=t=>v(h({},"__esModule",{value:!0}),t);var j={};D(j,{default:()=>O});module.exports=E(j);var e=require("react/jsx-runtime"),p=require("react"),s=require("../../components/index.js"),y=L(require("../Subscribe/index.js")),k=require("./types.js"),c=require("./icons/index.js"),u=require("react-responsive"),x=require("../../helpers/utils.js"),w=require("../../shared/Styles.js");const S=({data:{footer:t}={},currentCountry:o,event:i,subscribeLoading:l,classNames:n})=>{const[m,r]=(0,p.useState)(!1),d=(0,u.useMediaQuery)({query:"(max-width: 1439px)"});(0,p.useEffect)(()=>{r(d)},[d]);const f=(0,p.useMemo)(()=>t?.blocks?.find(a=>a?.blockType===k.FooterNavigationBlockType.Brand)?.country||{},[t]);return(0,e.jsxs)(s.Container,{className:(0,x.cn)(n?.root),childClassName:(0,x.cn)("laptop:py-16 desktop:gap-16 flex flex-col gap-8 bg-black py-8",n?.child),children:[(0,e.jsx)(s.Text,{html:t?.story,className:"desktop:text-sm text-xs font-bold text-[#6D6D6F]"}),t?.blocks?.map(a=>{if(a?.blockType===k.FooterNavigationBlockType.Signup)return(0,e.jsx)(T,{subscribeLoading:l,data:a,onSubmit:i?.signup},a.id);if(a?.blockType===k.FooterNavigationBlockType.Brand)return(0,e.jsx)(z,{data:a,isMobile:m,event:i,currentCountry:o},a?.id);if(a?.blockType===k.FooterNavigationBlockType.Main)return(0,e.jsx)($,{data:{...a,country:f},event:i,isMobile:m,currentCountry:o},a.id)})]})},T=({data:t,onSubmit:o,subscribeLoading:i})=>(0,e.jsxs)("div",{className:"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#080A0F] px-4 py-8",children:[(0,e.jsx)(y.default,{subscribeMetadata:t?.signup,className:"desktop:flex-[744]",onSubmit:o,loading:i}),(0,e.jsx)("div",{className:"desktop:hidden h-px w-full bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.enjoy?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.enjoy?.enjoys?.map(l=>(0,e.jsxs)("div",{className:"flex-start flex gap-2",children:[(0,e.jsx)(s.Picture,{source:l?.icon?.url,alt:l?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Text,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})]},l?.id))})]}),(0,e.jsx)("div",{className:"desktop:block hidden w-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.benefit?.title,className:"text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.benefit?.benefits?.map(l=>(0,e.jsx)(s.Link,{href:`${l?.link}?ref=footer`,asChild:!l?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},l?.id))})]})]})]}),$=({data:t,event:o,isMobile:i,currentCountry:l})=>{const[n,m]=(0,p.useState)(!1),{services:r,mainNav:d,country:f}=t;return(0,e.jsxs)("div",{className:"flex flex-col gap-8",children:[(0,e.jsxs)("div",{className:(0,x.cn)({"desktop:gap-16 flex":r?.download?.title}),children:[(0,e.jsxs)("div",{className:(0,x.cn)("w-full",{"desktop:flex-[1260]":r?.download?.title}),children:[(0,e.jsx)(s.Text,{html:r?.storeBenefits?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:(0,x.cn)("laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2",{"desktop:max-w-[648px]":r?.download?.title}),children:r?.storeBenefits?.reasons?.map(a=>(0,e.jsxs)("div",{className:"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2",children:[(0,e.jsx)(s.Picture,{source:a?.icon?.url,alt:a?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:`${a?.link}?ref=footer`,asChild:!a?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:a?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})})]},a?.id))})]}),(0,e.jsx)(N,{className:(0,x.cn)({"desktop:flex-[404] hidden desktop:block":r?.download?.title}),title:r?.download?.title,apps:r?.download?.apps})]}),(0,e.jsx)("div",{className:"desktop:block hidden h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:grid grid-cols-4 gap-4",children:[(0,e.jsx)(b,{title:d?.products?.title,lists:d?.products?.products}),(0,e.jsx)(b,{title:d?.explore?.title,lists:d?.explore?.explores}),(0,e.jsx)(b,{title:d?.support?.title,lists:d?.support?.supports}),(0,e.jsxs)("div",{className:"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4",children:[(0,e.jsxs)("div",{className:"desktop:pb-0 flex items-center justify-between pb-4",children:[(0,e.jsx)(s.Text,{as:"p",html:d?.contact?.title,className:"text-xl font-bold leading-[1.2] text-white"}),i&&(0,e.jsx)("button",{onClick:()=>m(!n),children:n?(0,e.jsx)(c.SubtractIcon,{width:20,height:20}):(0,e.jsx)(c.AddIcon,{width:20,height:20})})]}),(n&&i||!i)&&(0,e.jsx)("div",{className:"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2",children:d?.contact?.contacts?.map(a=>(0,e.jsxs)("div",{className:"flex items-start gap-2",children:[(0,e.jsx)(s.Picture,{source:a?.icon?.url,alt:a?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:a?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:a?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})})]},a?.id))}),(0,e.jsx)(g,{country:l||f,className:"desktop:hidden border-b border-[#3D3E3F]",isMobile:i,onChangeCountry:o?.country}),(0,e.jsx)("div",{className:"desktop:hidden mt-8",children:(0,e.jsx)(N,{title:r?.download?.title,apps:r?.download?.apps})}),!!d?.socials?.length&&(0,e.jsx)("div",{className:"mt-8 flex items-center gap-2",children:d?.socials?.map(a=>(0,e.jsx)(s.Link,{href:`${a?.link}?ref=footer`,children:(0,e.jsx)(s.Picture,{source:a?.icon?.url,alt:a?.icon?.alt,className:"size-8 shrink-0"})},a?.id))}),(0,e.jsx)("div",{className:"mt-4 flex flex-wrap gap-2",children:d?.payment?.map(a=>(0,e.jsx)(s.Link,{href:a?.link,children:(0,e.jsx)(s.Picture,{source:a?.icon?.url,alt:a?.icon?.alt,className:"h-[28px] w-[44px] shrink-0"})},a?.id))})]})]})]})},z=({data:t,isMobile:o,event:i,currentCountry:l})=>(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"desktop:items-center desktop:flex desktop:gap-4",children:[(0,e.jsxs)("div",{className:"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4",children:[(0,e.jsx)(s.Text,{html:t?.brand?.currentBrand,className:"text-[#B6B6BA]"}),(0,e.jsx)("div",{className:"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]"}),(0,e.jsx)("div",{className:"desktop:gap-6 flex flex-wrap items-center gap-4",children:t?.brand?.brands?.map(n=>(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,children:(0,e.jsx)(s.Text,{html:n?.icon,className:"text-[#B6B6BA] hover:text-white"})},n?.id))})]}),(0,e.jsx)(g,{country:l||t?.country,className:"desktop:flex-[316] desktop:block hidden",isMobile:o,onChangeCountry:i?.country})]}),(0,e.jsx)("div",{className:"h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1",children:[(0,e.jsx)(s.Text,{html:t?.copyright?.label,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"flex flex-wrap items-center gap-x-2 gap-y-1",children:[t?.policy?.policies?.map(n=>(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white",children:n?.label},n?.id)),t?.policy?.cookies&&(0,e.jsx)("button",{"data-cc":"show-preferencesModal",onClick:i?.cookiesSet,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white",children:t?.policy?.cookies})]})]})]}),b=({title:t,lists:o,className:i})=>{const[l,n]=(0,p.useState)(!1),[m,r]=(0,p.useState)(!1),d=(0,u.useMediaQuery)({query:"(max-width: 1439px)"});return(0,p.useEffect)(()=>{r(d)},[d]),(0,e.jsxs)("div",{className:(0,x.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",i),children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",onClick:()=>n(!l),children:[(0,e.jsx)(s.Text,{as:"p",html:t,className:"text-xl font-bold leading-[1.2] text-white"}),m&&(0,e.jsx)(e.Fragment,{children:l?(0,e.jsx)(c.SubtractIcon,{width:20,height:20}):(0,e.jsx)(c.AddIcon,{width:20,height:20})})]}),(l&&m||!m)&&(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:o?.map(f=>(0,e.jsx)(s.Link,{href:`${f?.link}?ref=footer`,className:"no-underline",children:(0,e.jsx)(s.Text,{html:f?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},f?.id))})]})},N=({title:t,apps:o,className:i})=>o?.length?(0,e.jsxs)("div",{className:i,children:[(0,e.jsx)(s.Text,{html:t,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex items-center gap-4",children:o?.map(l=>(0,e.jsxs)("div",{className:"flex flex-col items-center gap-[6px]",children:[(0,e.jsx)(s.Link,{href:l?.link,children:(0,e.jsx)(s.Picture,{source:l?.icon?.url,alt:l?.icon?.alt,className:"size-10 shrink-0"})}),l?.label&&(0,e.jsx)(s.Text,{html:l?.label,className:"text-xs font-bold  text-[#999999]"})]},l?.id))})]}):null,g=({country:t,isMobile:o,className:i,onChangeCountry:l})=>(0,e.jsx)("div",{className:(0,x.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",i),onClick:()=>l?.(),children:(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex cursor-pointer items-center gap-2",children:[(0,e.jsx)(c.CountryIcon,{width:20,height:20,className:"shrink-0"}),(0,e.jsx)(s.Text,{as:"p",html:t?.countryName||t?.country,className:"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white"})]}),o&&(0,e.jsx)("button",{children:(0,e.jsx)(c.ArrowRightIcon,{width:20,height:20})})]})});var O=(0,w.withLayout)(S);
 //# sourceMappingURL=index.js.map

package/dist/cjs/biz-components/FooterNavigation/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/FooterNavigation/index.tsx"],
-  "sourcesContent": ["import { useEffect, useMemo, useState } from 'react'\nimport { Picture, Text, Container, Link } from '../../components/index.js'\nimport Subscribe from '../Subscribe/index.js'\nimport type { FooterNavigationProps } from './types.js'\nimport { FooterNavigationBlockType } from './types.js'\nimport { AddIcon, SubtractIcon, ArrowRightIcon, CountryIcon } from './icons/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst FooterNavigation = ({\n  data: { footerNavigation } = {},\n  currentCountry,\n  event,\n  subscribeLoading,\n}: FooterNavigationProps) => {\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const country = useMemo(() => {\n    return (\n      footerNavigation?.footerBlocks?.find((block: any) => block?.blockType === FooterNavigationBlockType.Brand)\n        ?.country || {}\n    )\n  }, [footerNavigation])\n\n  return (\n    <Container childClassName=\"bg-black py-8 laptop:py-16 flex flex-col desktop:gap-16 gap-8\">\n      <Text html={footerNavigation?.story} className=\"desktop:text-sm text-xs font-bold text-[#6D6D6F]\" />\n      {footerNavigation?.footerBlocks?.map((block: any) => {\n        if (block?.blockType === FooterNavigationBlockType.Signup) {\n          return (\n            <MarketingConversion\n              key={block.id}\n              subscribeLoading={subscribeLoading}\n              data={block}\n              onSubmit={event?.signup}\n            />\n          )\n        }\n        if (block?.blockType === FooterNavigationBlockType.Brand) {\n          return (\n            <FooterBrand\n              key={block?.id}\n              data={block}\n              isMobile={isMobile}\n              event={event}\n              currentCountry={currentCountry}\n            />\n          )\n        }\n        if (block?.blockType === FooterNavigationBlockType.Main) {\n          return (\n            <MainServices\n              key={block.id}\n              data={{ ...block, country }}\n              event={event}\n              isMobile={isMobile}\n              currentCountry={currentCountry}\n            />\n          )\n        }\n      })}\n    </Container>\n  )\n}\n\n/**\n * MarketingConversion \u8425\u9500\u8F6C\u5316\u6A21\u5757\n * @param data\n * @param onSubmit signup\u63D0\u4EA4\u4E8B\u4EF6\n * @returns\n */\nconst MarketingConversion = ({\n  data,\n  onSubmit,\n  subscribeLoading,\n}: {\n  data: any\n  onSubmit?: (_params: any) => void\n  subscribeLoading?: boolean\n}) => {\n  return (\n    <div className=\"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#080A0F] px-4 py-8\">\n      <Subscribe\n        subscribeMetadata={data?.signup}\n        className=\"desktop:flex-[744]\"\n        onSubmit={onSubmit}\n        loading={subscribeLoading}\n      />\n      <div className=\"desktop:hidden h-px w-full bg-[#3D3E3F]\" />\n      <div className=\"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4\">\n        <div className=\"flex-1\">\n          <Text html={data?.enjoy?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.enjoy?.enjoys?.map((enjoyItem: any) => (\n              <div key={enjoyItem?.id} className=\"flex-start flex gap-2\">\n                <Picture source={enjoyItem?.icon?.url} alt={enjoyItem?.icon?.alt} className=\"size-5 shrink-0\" />\n                <Text\n                  html={enjoyItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                />\n              </div>\n            ))}\n          </div>\n        </div>\n        <div className=\"desktop:block hidden w-px bg-[#3D3E3F]\" />\n        <div className=\"flex-1\">\n          <Text html={data?.benefit?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.benefit?.benefits?.map((benefitItem: any) => (\n              <Link\n                href={`${benefitItem?.link}?ref=footer`}\n                asChild={!benefitItem?.link}\n                key={benefitItem?.id}\n                className=\"no-underline\"\n              >\n                <Text\n                  html={benefitItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/**\n * MainServices \u4E3B\u5BFC\u822A\u4E0E\u670D\u52A1\u6A21\u5757\n * @param services \u670D\u52A1\n * @param mainNav \u4E3B\u5BFC\u822A\n * @param event \u4E8B\u4EF6\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @param currentCountry \u5F53\u524D\u56FD\u5BB6\n * @returns\n */\nconst MainServices = ({\n  data,\n  event,\n  isMobile,\n  currentCountry,\n}: {\n  data: any\n  event: any\n  isMobile: boolean\n  currentCountry: any\n}) => {\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const { services, mainNav, country } = data\n  return (\n    <div className=\"flex flex-col gap-8\">\n      <div\n        className={cn({\n          'desktop:gap-16 flex': services?.download?.title,\n        })}\n      >\n        <div\n          className={cn('w-full', {\n            'desktop:flex-[1260]': services?.download?.title,\n          })}\n        >\n          <Text html={services?.storeBenefits?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div\n            className={cn('laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2', {\n              'desktop:max-w-[648px]': services?.download?.title,\n            })}\n          >\n            {services?.storeBenefits?.reasons?.map((reasonItem: any) => (\n              <div key={reasonItem?.id} className=\"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2\">\n                <Picture source={reasonItem?.icon?.url} alt={reasonItem?.icon?.alt} className=\"size-5 shrink-0\" />\n                <Link href={`${reasonItem?.link}?ref=footer`} asChild={!reasonItem?.link} className=\"no-underline\">\n                  <Text\n                    html={reasonItem?.label}\n                    className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                  />\n                </Link>\n              </div>\n            ))}\n          </div>\n        </div>\n        <DownloadApp\n          className={cn({\n            'desktop:flex-[404] hidden desktop:block': services?.download?.title,\n          })}\n          title={services?.download?.title}\n          apps={services?.download?.apps}\n        />\n      </div>\n      <div className=\"desktop:block hidden h-px bg-[#3D3E3F]\" />\n      <div className=\"desktop:grid grid-cols-4 gap-4\">\n        <MainNavMenu title={mainNav?.products?.title} lists={mainNav?.products?.products} />\n        <MainNavMenu title={mainNav?.explore?.title} lists={mainNav?.explore?.explores} />\n        <MainNavMenu title={mainNav?.support?.title} lists={mainNav?.support?.supports} />\n        <div className=\"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4\">\n          <div className=\"desktop:pb-0 flex items-center justify-between pb-4\">\n            <Text as=\"p\" html={mainNav?.contact?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n            {isMobile && (\n              <button onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n                {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n              </button>\n            )}\n          </div>\n          {((mainNavMenuOpen && isMobile) || !isMobile) && (\n            <div className=\"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2\">\n              {mainNav?.contact?.contacts?.map((contactItem: any) => (\n                <div key={contactItem?.id} className=\"flex items-start gap-2\">\n                  <Picture source={contactItem?.icon?.url} alt={contactItem?.icon?.alt} className=\"size-5 shrink-0\" />\n                  <Link href={contactItem?.link} className=\"no-underline\">\n                    <Text\n                      html={contactItem?.label}\n                      className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n                    />\n                  </Link>\n                </div>\n              ))}\n            </div>\n          )}\n          <ChangeCountry\n            country={currentCountry || country}\n            className=\"desktop:hidden border-b border-[#3D3E3F]\"\n            isMobile={isMobile}\n            onChangeCountry={event?.country}\n          />\n          <div className=\"desktop:hidden mt-8\">\n            <DownloadApp title={services?.download?.title} apps={services?.download?.apps} />\n          </div>\n          {!!mainNav?.socials?.length && (\n            <div className=\"mt-8 flex items-center gap-2\">\n              {mainNav?.socials?.map((socialItem: any) => (\n                <Link href={`${socialItem?.link}?ref=footer`} key={socialItem?.id}>\n                  <Picture source={socialItem?.icon?.url} alt={socialItem?.icon?.alt} className=\"size-8 shrink-0\" />\n                </Link>\n              ))}\n            </div>\n          )}\n          <div className=\"mt-4 flex flex-wrap gap-2\">\n            {mainNav?.payment?.map((paymentItem: any) => (\n              <Link href={paymentItem?.link} key={paymentItem?.id}>\n                <Picture\n                  source={paymentItem?.icon?.url}\n                  alt={paymentItem?.icon?.alt}\n                  className=\"h-[28px] w-[44px] shrink-0\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst FooterBrand = ({\n  data,\n  isMobile,\n  event,\n  currentCountry,\n}: {\n  data: any\n  isMobile: boolean\n  event: any\n  currentCountry: any\n}) => {\n  return (\n    <div className=\"flex flex-col gap-4\">\n      <div className=\"desktop:items-center desktop:flex desktop:gap-4\">\n        <div className=\"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4\">\n          <Text html={data?.brand?.currentBrand} className=\"text-[#B6B6BA]\" />\n          <div className=\"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]\" />\n          <div className=\"desktop:gap-6 flex flex-wrap items-center gap-4\">\n            {data?.brand?.brands?.map((brandItem: any) => (\n              <Link href={`${brandItem?.link}?ref=footer`} key={brandItem?.id}>\n                <Text html={brandItem?.icon} className=\"text-[#B6B6BA] hover:text-white\" />\n              </Link>\n            ))}\n          </div>\n        </div>\n        <ChangeCountry\n          country={currentCountry || data?.country}\n          className=\"desktop:flex-[316] desktop:block hidden\"\n          isMobile={isMobile}\n          onChangeCountry={event?.country}\n        />\n      </div>\n      <div className=\"h-px bg-[#3D3E3F]\" />\n      <div className=\"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1\">\n        <Text\n          html={data?.copyright?.label}\n          className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n        />\n        <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n          {data?.policy?.policies?.map((policyItem: any) => (\n            <Link\n              href={`${policyItem?.link}?ref=footer`}\n              key={policyItem?.id}\n              className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white\"\n            >\n              {policyItem?.label}\n            </Link>\n          ))}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst MainNavMenu = ({ title, lists, className }: { title: string; lists: any[]; className?: string }) => {\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  return (\n    <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n      <div className=\"flex items-center justify-between\" onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n        <Text as=\"p\" html={title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n        {isMobile && (\n          <>{mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}</>\n        )}\n      </div>\n      {((mainNavMenuOpen && isMobile) || !isMobile) && (\n        <div className=\"mt-4 flex flex-col gap-2\">\n          {lists?.map((item: any) => (\n            <Link href={`${item?.link}?ref=footer`} key={item?.id} className=\"no-underline\">\n              <Text\n                html={item?.label}\n                className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n              />\n            </Link>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\n/**\n * DownloadApp \u4E0B\u8F7D\u5E94\u7528\u6A21\u5757\n * @param title\n * @param apps\n * @param className\n * @returns\n */\nconst DownloadApp = ({ title, apps, className }: { title: string; apps: any[]; className?: string }) => {\n  if (!apps?.length) return null\n  return (\n    <div className={className}>\n      <Text html={title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n      <div className=\"mt-4 flex items-center gap-4\">\n        {apps?.map((appItem: any) => (\n          <div key={appItem?.id} className=\"flex flex-col items-center gap-[6px]\">\n            <Link href={appItem?.link}>\n              <Picture source={appItem?.icon?.url} alt={appItem?.icon?.alt} className=\"size-10 shrink-0\" />\n            </Link>\n            {appItem?.label && <Text html={appItem?.label} className=\"text-xs font-bold  text-[#999999]\" />}\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\n/**\n * ChangeCountry \u5207\u6362\u56FD\u5BB6\u6A21\u5757\n * @param data \u6570\u636E\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @returns\n */\nconst ChangeCountry = ({\n  country,\n  isMobile,\n  className,\n  onChangeCountry,\n}: {\n  country: any\n  isMobile: boolean\n  className?: string\n  onChangeCountry?: () => void\n}) => {\n  return (\n    <div\n      className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}\n      onClick={() => onChangeCountry?.()}\n    >\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex cursor-pointer items-center gap-2\">\n          <CountryIcon width={20} height={20} className=\"shrink-0\" />\n          <Text\n            as=\"p\"\n            html={country?.countryName || country?.country}\n            className=\"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white\"\n          />\n        </div>\n        {isMobile && (\n          <button>\n            <ArrowRightIcon width={20} height={20} />\n          </button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(FooterNavigation)\n"],
-  "mappings": "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",
-  "names": ["FooterNavigation_exports", "__export", "FooterNavigation_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_Subscribe", "import_types", "import_icons", "import_react_responsive", "import_utils", "import_Styles", "FooterNavigation", "footerNavigation", "currentCountry", "event", "subscribeLoading", "isMobile", "setIsMobile", "mediaQuery", "country", "block", "MarketingConversion", "FooterBrand", "MainServices", "data", "onSubmit", "Subscribe", "enjoyItem", "benefitItem", "mainNavMenuOpen", "setMainNavMenuOpen", "services", "mainNav", "reasonItem", "DownloadApp", "MainNavMenu", "contactItem", "ChangeCountry", "socialItem", "paymentItem", "brandItem", "policyItem", "title", "lists", "className", "item", "apps", "appItem", "onChangeCountry"]
+  "sourcesContent": ["import { useEffect, useMemo, useState } from 'react'\nimport { Picture, Text, Container, Link } from '../../components/index.js'\nimport Subscribe from '../Subscribe/index.js'\nimport type { FooterNavigationProps } from './types.js'\nimport { FooterNavigationBlockType } from './types.js'\nimport { AddIcon, SubtractIcon, ArrowRightIcon, CountryIcon } from './icons/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst FooterNavigation = ({\n  data: { footer } = {},\n  currentCountry,\n  event,\n  subscribeLoading,\n  classNames,\n}: FooterNavigationProps) => {\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  const country = useMemo(() => {\n    return footer?.blocks?.find((block: any) => block?.blockType === FooterNavigationBlockType.Brand)?.country || {}\n  }, [footer])\n\n  return (\n    <Container\n      className={cn(classNames?.root)}\n      childClassName={cn('laptop:py-16 desktop:gap-16 flex flex-col gap-8 bg-black py-8', classNames?.child)}\n    >\n      <Text html={footer?.story} className=\"desktop:text-sm text-xs font-bold text-[#6D6D6F]\" />\n      {footer?.blocks?.map((block: any) => {\n        if (block?.blockType === FooterNavigationBlockType.Signup) {\n          return (\n            <MarketingConversion\n              key={block.id}\n              subscribeLoading={subscribeLoading}\n              data={block}\n              onSubmit={event?.signup}\n            />\n          )\n        }\n        if (block?.blockType === FooterNavigationBlockType.Brand) {\n          return (\n            <FooterBrand\n              key={block?.id}\n              data={block}\n              isMobile={isMobile}\n              event={event}\n              currentCountry={currentCountry}\n            />\n          )\n        }\n        if (block?.blockType === FooterNavigationBlockType.Main) {\n          return (\n            <MainServices\n              key={block.id}\n              data={{ ...block, country }}\n              event={event}\n              isMobile={isMobile}\n              currentCountry={currentCountry}\n            />\n          )\n        }\n      })}\n    </Container>\n  )\n}\n\n/**\n * MarketingConversion \u8425\u9500\u8F6C\u5316\u6A21\u5757\n * @param data\n * @param onSubmit signup\u63D0\u4EA4\u4E8B\u4EF6\n * @returns\n */\nconst MarketingConversion = ({\n  data,\n  onSubmit,\n  subscribeLoading,\n}: {\n  data: any\n  onSubmit?: (_params: any) => void\n  subscribeLoading?: boolean\n}) => {\n  return (\n    <div className=\"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row rounded-btn flex flex-col gap-8 bg-[#080A0F] px-4 py-8\">\n      <Subscribe\n        subscribeMetadata={data?.signup}\n        className=\"desktop:flex-[744]\"\n        onSubmit={onSubmit}\n        loading={subscribeLoading}\n      />\n      <div className=\"desktop:hidden h-px w-full bg-[#3D3E3F]\" />\n      <div className=\"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4\">\n        <div className=\"flex-1\">\n          <Text html={data?.enjoy?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.enjoy?.enjoys?.map((enjoyItem: any) => (\n              <div key={enjoyItem?.id} className=\"flex-start flex gap-2\">\n                <Picture source={enjoyItem?.icon?.url} alt={enjoyItem?.icon?.alt} className=\"size-5 shrink-0\" />\n                <Text\n                  html={enjoyItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                />\n              </div>\n            ))}\n          </div>\n        </div>\n        <div className=\"desktop:block hidden w-px bg-[#3D3E3F]\" />\n        <div className=\"flex-1\">\n          <Text html={data?.benefit?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n          <div className=\"mt-4 flex flex-col gap-2\">\n            {data?.benefit?.benefits?.map((benefitItem: any) => (\n              <Link\n                href={`${benefitItem?.link}?ref=footer`}\n                asChild={!benefitItem?.link}\n                key={benefitItem?.id}\n                className=\"no-underline\"\n              >\n                <Text\n                  html={benefitItem?.label}\n                  className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/**\n * MainServices \u4E3B\u5BFC\u822A\u4E0E\u670D\u52A1\u6A21\u5757\n * @param services \u670D\u52A1\n * @param mainNav \u4E3B\u5BFC\u822A\n * @param event \u4E8B\u4EF6\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @param currentCountry \u5F53\u524D\u56FD\u5BB6\n * @returns\n */\nconst MainServices = ({\n  data,\n  event,\n  isMobile,\n  currentCountry,\n}: {\n  data: any\n  event: any\n  isMobile: boolean\n  currentCountry: any\n}) => {\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const { services, mainNav, country } = data\n  return (\n    <div className=\"flex flex-col gap-8\">\n      <div\n        className={cn({\n          'desktop:gap-16 flex': services?.download?.title,\n        })}\n      >\n        <div\n          className={cn('w-full', {\n            'desktop:flex-[1260]': services?.download?.title,\n          })}\n        >\n          <Text html={services?.storeBenefits?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n          <div\n            className={cn('laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2', {\n              'desktop:max-w-[648px]': services?.download?.title,\n            })}\n          >\n            {services?.storeBenefits?.reasons?.map((reasonItem: any) => (\n              <div key={reasonItem?.id} className=\"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2\">\n                <Picture source={reasonItem?.icon?.url} alt={reasonItem?.icon?.alt} className=\"size-5 shrink-0\" />\n                <Link href={`${reasonItem?.link}?ref=footer`} asChild={!reasonItem?.link} className=\"no-underline\">\n                  <Text\n                    html={reasonItem?.label}\n                    className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n                  />\n                </Link>\n              </div>\n            ))}\n          </div>\n        </div>\n        <DownloadApp\n          className={cn({\n            'desktop:flex-[404] hidden desktop:block': services?.download?.title,\n          })}\n          title={services?.download?.title}\n          apps={services?.download?.apps}\n        />\n      </div>\n      <div className=\"desktop:block hidden h-px bg-[#3D3E3F]\" />\n      <div className=\"desktop:grid grid-cols-4 gap-4\">\n        <MainNavMenu title={mainNav?.products?.title} lists={mainNav?.products?.products} />\n        <MainNavMenu title={mainNav?.explore?.title} lists={mainNav?.explore?.explores} />\n        <MainNavMenu title={mainNav?.support?.title} lists={mainNav?.support?.supports} />\n        <div className=\"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4\">\n          <div className=\"desktop:pb-0 flex items-center justify-between pb-4\">\n            <Text as=\"p\" html={mainNav?.contact?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n            {isMobile && (\n              <button onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n                {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n              </button>\n            )}\n          </div>\n          {((mainNavMenuOpen && isMobile) || !isMobile) && (\n            <div className=\"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2\">\n              {mainNav?.contact?.contacts?.map((contactItem: any) => (\n                <div key={contactItem?.id} className=\"flex items-start gap-2\">\n                  <Picture source={contactItem?.icon?.url} alt={contactItem?.icon?.alt} className=\"size-5 shrink-0\" />\n                  <Link href={contactItem?.link} className=\"no-underline\">\n                    <Text\n                      html={contactItem?.label}\n                      className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n                    />\n                  </Link>\n                </div>\n              ))}\n            </div>\n          )}\n          <ChangeCountry\n            country={currentCountry || country}\n            className=\"desktop:hidden border-b border-[#3D3E3F]\"\n            isMobile={isMobile}\n            onChangeCountry={event?.country}\n          />\n          <div className=\"desktop:hidden mt-8\">\n            <DownloadApp title={services?.download?.title} apps={services?.download?.apps} />\n          </div>\n          {!!mainNav?.socials?.length && (\n            <div className=\"mt-8 flex items-center gap-2\">\n              {mainNav?.socials?.map((socialItem: any) => (\n                <Link href={`${socialItem?.link}?ref=footer`} key={socialItem?.id}>\n                  <Picture source={socialItem?.icon?.url} alt={socialItem?.icon?.alt} className=\"size-8 shrink-0\" />\n                </Link>\n              ))}\n            </div>\n          )}\n          <div className=\"mt-4 flex flex-wrap gap-2\">\n            {mainNav?.payment?.map((paymentItem: any) => (\n              <Link href={paymentItem?.link} key={paymentItem?.id}>\n                <Picture\n                  source={paymentItem?.icon?.url}\n                  alt={paymentItem?.icon?.alt}\n                  className=\"h-[28px] w-[44px] shrink-0\"\n                />\n              </Link>\n            ))}\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst FooterBrand = ({\n  data,\n  isMobile,\n  event,\n  currentCountry,\n}: {\n  data: any\n  isMobile: boolean\n  event: any\n  currentCountry: any\n}) => {\n  return (\n    <div className=\"flex flex-col gap-4\">\n      <div className=\"desktop:items-center desktop:flex desktop:gap-4\">\n        <div className=\"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4\">\n          <Text html={data?.brand?.currentBrand} className=\"text-[#B6B6BA]\" />\n          <div className=\"laptop:block laptop:mb-[10px] hidden h-[20px] w-px bg-[#B6B6BA]\" />\n          <div className=\"desktop:gap-6 flex flex-wrap items-center gap-4\">\n            {data?.brand?.brands?.map((brandItem: any) => (\n              <Link href={`${brandItem?.link}?ref=footer`} key={brandItem?.id}>\n                <Text html={brandItem?.icon} className=\"text-[#B6B6BA] hover:text-white\" />\n              </Link>\n            ))}\n          </div>\n        </div>\n        <ChangeCountry\n          country={currentCountry || data?.country}\n          className=\"desktop:flex-[316] desktop:block hidden\"\n          isMobile={isMobile}\n          onChangeCountry={event?.country}\n        />\n      </div>\n      <div className=\"h-px bg-[#3D3E3F]\" />\n      <div className=\"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1\">\n        <Text\n          html={data?.copyright?.label}\n          className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n        />\n        <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n          {data?.policy?.policies?.map((policyItem: any) => (\n            <Link\n              href={`${policyItem?.link}?ref=footer`}\n              key={policyItem?.id}\n              className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white\"\n            >\n              {policyItem?.label}\n            </Link>\n          ))}\n          {data?.policy?.cookies && (\n            <button\n              data-cc=\"show-preferencesModal\"\n              onClick={event?.cookiesSet}\n              className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline hover:text-white\"\n            >\n              {data?.policy?.cookies}\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst MainNavMenu = ({ title, lists, className }: { title: string; lists: any[]; className?: string }) => {\n  const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n  const [isMobile, setIsMobile] = useState(false)\n\n  const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n  useEffect(() => {\n    setIsMobile(mediaQuery)\n  }, [mediaQuery])\n\n  return (\n    <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n      <div className=\"flex items-center justify-between\" onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n        <Text as=\"p\" html={title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n        {isMobile && (\n          <>{mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}</>\n        )}\n      </div>\n      {((mainNavMenuOpen && isMobile) || !isMobile) && (\n        <div className=\"mt-4 flex flex-col gap-2\">\n          {lists?.map((item: any) => (\n            <Link href={`${item?.link}?ref=footer`} key={item?.id} className=\"no-underline\">\n              <Text\n                html={item?.label}\n                className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n              />\n            </Link>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\n/**\n * DownloadApp \u4E0B\u8F7D\u5E94\u7528\u6A21\u5757\n * @param title\n * @param apps\n * @param className\n * @returns\n */\nconst DownloadApp = ({ title, apps, className }: { title: string; apps: any[]; className?: string }) => {\n  if (!apps?.length) return null\n  return (\n    <div className={className}>\n      <Text html={title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n      <div className=\"mt-4 flex items-center gap-4\">\n        {apps?.map((appItem: any) => (\n          <div key={appItem?.id} className=\"flex flex-col items-center gap-[6px]\">\n            <Link href={appItem?.link}>\n              <Picture source={appItem?.icon?.url} alt={appItem?.icon?.alt} className=\"size-10 shrink-0\" />\n            </Link>\n            {appItem?.label && <Text html={appItem?.label} className=\"text-xs font-bold  text-[#999999]\" />}\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\n/**\n * ChangeCountry \u5207\u6362\u56FD\u5BB6\u6A21\u5757\n * @param data \u6570\u636E\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @returns\n */\nconst ChangeCountry = ({\n  country,\n  isMobile,\n  className,\n  onChangeCountry,\n}: {\n  country: any\n  isMobile: boolean\n  className?: string\n  onChangeCountry?: () => void\n}) => {\n  return (\n    <div\n      className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}\n      onClick={() => onChangeCountry?.()}\n    >\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex cursor-pointer items-center gap-2\">\n          <CountryIcon width={20} height={20} className=\"shrink-0\" />\n          <Text\n            as=\"p\"\n            html={country?.countryName || country?.country}\n            className=\"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white\"\n          />\n        </div>\n        {isMobile && (\n          <button>\n            <ArrowRightIcon width={20} height={20} />\n          </button>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport default withLayout(FooterNavigation)\n"],
+  "mappings": "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",
+  "names": ["FooterNavigation_exports", "__export", "FooterNavigation_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_Subscribe", "import_types", "import_icons", "import_react_responsive", "import_utils", "import_Styles", "FooterNavigation", "footer", "currentCountry", "event", "subscribeLoading", "classNames", "isMobile", "setIsMobile", "mediaQuery", "country", "block", "MarketingConversion", "FooterBrand", "MainServices", "data", "onSubmit", "Subscribe", "enjoyItem", "benefitItem", "mainNavMenuOpen", "setMainNavMenuOpen", "services", "mainNav", "reasonItem", "DownloadApp", "MainNavMenu", "contactItem", "ChangeCountry", "socialItem", "paymentItem", "brandItem", "policyItem", "title", "lists", "className", "item", "apps", "appItem", "onChangeCountry"]
 }

package/dist/cjs/biz-components/FooterNavigation/types.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+export type FooterNavigationSemanticName = 'root' | 'child';
 export interface FooterNavigationProps {
     data: any;
     currentCountry?: any;
@@ -6,7 +7,9 @@ export interface FooterNavigationProps {
         signup?: (_params: any) => void;
         download?: () => void;
         country?: () => void;
+        cookiesSet?: () => void;
     };
+    classNames?: Partial<Record<FooterNavigationSemanticName, string>>;
 }
 export declare enum FooterNavigationBlockType {
     Signup = "ipc-footer-signup",

package/dist/cjs/biz-components/FooterNavigation/types.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var d=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var t=Object.prototype.hasOwnProperty;var s=(r,n)=>{for(var o in n)d(r,o,{get:n[o],enumerable:!0})},b=(r,n,o,a)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of p(n))!t.call(r,i)&&i!==o&&d(r,i,{get:()=>n[i],enumerable:!(a=u(n,i))||a.enumerable});return r};var c=r=>b(d({},"__esModule",{value:!0}),r);var f={};s(f,{FooterNavigationBlockType:()=>e});module.exports=c(f);var e=(a=>(a.Signup="ipc-footer-signup",a.Main="ipc-footer-main",a.Brand="ipc-footer-brand",a))(e||{});
+"use strict";var r=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var p=(o,a)=>{for(var e in a)r(o,e,{get:a[e],enumerable:!0})},m=(o,a,e,n)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of s(a))!c.call(o,i)&&i!==e&&r(o,i,{get:()=>a[i],enumerable:!(n=d(a,i))||n.enumerable});return o};var u=o=>m(r({},"__esModule",{value:!0}),o);var g={};p(g,{FooterNavigationBlockType:()=>t});module.exports=u(g);var t=(n=>(n.Signup="ipc-footer-signup",n.Main="ipc-footer-main",n.Brand="ipc-footer-brand",n))(t||{});
 //# sourceMappingURL=types.js.map

package/dist/cjs/biz-components/FooterNavigation/types.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/FooterNavigation/types.ts"],
-  "sourcesContent": ["export interface FooterNavigationProps {\n  data: any\n  currentCountry?: any\n  subscribeLoading?: boolean\n  event?: {\n    signup?: (_params: any) => void\n    download?: () => void\n    country?: () => void\n  }\n}\n\nexport enum FooterNavigationBlockType {\n  Signup = 'ipc-footer-signup',\n  Main = 'ipc-footer-main',\n  Brand = 'ipc-footer-brand',\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,+BAAAE,IAAA,eAAAC,EAAAH,GAWO,IAAKE,OACVA,EAAA,OAAS,oBACTA,EAAA,KAAO,kBACPA,EAAA,MAAQ,mBAHEA,OAAA",
+  "sourcesContent": ["export type FooterNavigationSemanticName = 'root' | 'child'\n\nexport interface FooterNavigationProps {\n  data: any\n  currentCountry?: any\n  subscribeLoading?: boolean\n  event?: {\n    signup?: (_params: any) => void\n    download?: () => void\n    country?: () => void\n    cookiesSet?: () => void\n  }\n  classNames?: Partial<Record<FooterNavigationSemanticName, string>>\n}\n\nexport enum FooterNavigationBlockType {\n  Signup = 'ipc-footer-signup',\n  Main = 'ipc-footer-main',\n  Brand = 'ipc-footer-brand',\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,+BAAAE,IAAA,eAAAC,EAAAH,GAeO,IAAKE,OACVA,EAAA,OAAS,oBACTA,EAAA,KAAO,kBACPA,EAAA,MAAQ,mBAHEA,OAAA",
   "names": ["types_exports", "__export", "FooterNavigationBlockType", "__toCommonJS"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var ve=Object.create;var G=Object.defineProperty;var ge=Object.getOwnPropertyDescriptor;var ye=Object.getOwnPropertyNames;var he=Object.getPrototypeOf,xe=Object.prototype.hasOwnProperty;var Ne=(t,n)=>{for(var o in n)G(t,o,{get:n[o],enumerable:!0})},ee=(t,n,o,c)=>{if(n&&typeof n=="object"||typeof n=="function")for(let r of ye(n))!xe.call(t,r)&&r!==o&&G(t,r,{get:()=>n[r],enumerable:!(c=ge(n,r))||c.enumerable});return t};var K=(t,n,o)=>(o=t!=null?ve(he(t)):{},ee(n||!t||!t.__esModule?G(o,"default",{value:t,enumerable:!0}):o,t)),ke=t=>ee(G({},"__esModule",{value:!0}),t);var Be={};Ne(Be,{default:()=>He});module.exports=ke(Be);var e=require("react/jsx-runtime"),a=K(require("react")),l=require("../../components/index.js"),ue=require("../../shared/Styles.js"),k=require("../../helpers/utils.js"),E=K(require("./NavProvider.js")),x=require("./types.js"),me=require("es-toolkit"),pe=K(require("jump.js")),J=require("@gsap/react"),V=require("gsap"),T=require("./withCategory.js"),P=require("./icons/index.js"),be=K(require("../NavigationSearch/index.js"));const te=(0,a.forwardRef)((t,n)=>{const{data:{headerNavigation:o}={},buildProps:c,event:r,profile:f,theme:u="light",isTop:m=!1,searchResult:d,onSearch:w,isSearching:i,keywords:C,onPrimaryNavClick:N,onSeriesProductClick:v,onSidebarNavClick:g,headerId:y,cartCount:p}=t,s=(0,a.useRef)(null),[b,S]=(0,a.useState)(!1),[D,z]=(0,a.useState)(!1),[M,j]=(0,a.useState)(!1),[_,L]=(0,a.useState)(!1),$=(0,a.useRef)(null),A=()=>{const F=document?.querySelector("body")?.offsetWidth||0;L(F<=1440)};(0,a.useEffect)(()=>(A(),window.addEventListener("resize",A),()=>{window.removeEventListener("resize",A)}),[]),(0,a.useImperativeHandle)(n,()=>$.current),(0,a.useEffect)(()=>{$.current&&m&&(0,pe.default)($.current,{duration:0,offset:$.current?.getBoundingClientRect()?.bottom||0})},[m]),(0,a.useEffect)(()=>{r&&(r.search=()=>S(!0))},[r]),(0,J.useGSAP)(()=>{s?.current&&b&&V.gsap.fromTo(s.current,{height:0},{height:"auto",duration:.3})},[b]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=b?"hidden":"auto"},[b]);const q=(0,a.useMemo)(()=>o?.headerBar?.actions?.find(F=>F?.blockType===x.HeaderNavigationActionBlockType.Search)?.searchBar?.[0]||{},[o]);return(0,e.jsx)(E.default,{buildProps:c,profile:f,isMobile:_,event:r,payloadData:o,onSidebarNavClick:g,onSeriesProductClick:v,cartCount:p,children:(0,e.jsx)("header",{id:y||"header","data-ui-component-id":"HeaderNavigation",className:"relative z-[100] bg-white",ref:$,children:(0,e.jsxs)("div",{className:(0,k.cn)("hover:bg-white hover:text-black",u==="light"?"text-black":"text-white",{}),onClick:()=>j(!0),children:[(0,e.jsx)(ae,{data:o,className:"desktop:block hidden !bg-white",theme:u,onNavItemClick:()=>j(!0),onPrimaryNavClick:N}),(0,e.jsx)(re,{data:o,className:"desktop:hidden block !bg-white",onPrimaryNavClick:N}),b&&(0,e.jsxs)("div",{className:"absolute left-0 top-0 z-[60] flex w-full flex-col bg-black/70",style:{height:`calc(100dvh - ${$?.current?.getBoundingClientRect()?.top}px)`},children:[(0,e.jsx)("div",{ref:s,className:(0,k.cn)("overflow-y-auto",{}),children:(0,e.jsx)(be.default,{data:q,keywords:C,isSearching:i,searchResult:d,onSearch:F=>{w?.(F)},onClose:()=>{w?.(),S(!1)}})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>S(!1)})]})]})})})}),ae=(0,a.forwardRef)((t,n)=>{const{data:o,onNavItemClick:c,className:r,theme:f,onPrimaryNavClick:u}=t,{event:m,profile:d}=(0,E.useNavContext)(),[w,i]=(0,a.useState)(!1),C=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(o?.categories?.filter(h=>h?.pcShow)),[o]),[N,v]=(0,a.useState)(null),[g,y]=(0,a.useState)([]),p=(0,a.useRef)(null),[s,b]=(0,a.useState)(!1),S=(0,a.useRef)(null),D=(0,a.useRef)(null),z=(0,a.useRef)(C.map(h=>Array(h?.length||0).fill(null)));(0,a.useEffect)(()=>{C?.length&&y(C?.map((h,H)=>h?.map((B,R)=>({groupIndex:H,index:R,open:!1}))))},[C]);const M=(0,a.useMemo)(()=>{let h=null;for(const H of g){for(const B of H)if(B.open){h=B;break}if(h)break}return h},[g]);(0,a.useEffect)(()=>{document.documentElement.style.overflow=M?.open||s?"hidden":"auto"},[M?.open,s]);const j=(h,H,B)=>{if(b(!1),N?.components?.[0]?.blockType===x.HeaderNavigationBlockType.Links)N?.components?.[0]?.url&&window.open(N?.components?.[0]?.url);else{const R=C?.flat()||[],I=R?.findIndex(Y=>Y?.id===C[H][B]?.id);h.stopPropagation(),c?.(),u?.(R[I],I),v(C[H][B]),y(Y=>Y.map(fe=>fe.map(W=>W.groupIndex===H&&W.index===B?{...W,open:!W.open}:{...W,open:!1})))}},_=()=>{y(h=>h.map(H=>H.map(B=>({...B,open:!1}))))},L=(0,a.useMemo)(()=>{if(N)return N?.components?.[0]?.blockType},[N]),$=(0,T.WithSidebar)(ne,N),A=(0,T.WithMulticol)(we,N),q=(0,T.WithSupports)(Ce,{categoriesItem:N,currentNavItemRef:z.current?.[M?.groupIndex||0]?.[M?.index||0]}),F=(0,a.useMemo)(()=>{switch(L){case x.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)($,{});case x.HeaderNavigationBlockType.Supports:return(0,e.jsx)(q,{});case x.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(A,{});default:return null}},[L,N]),Q=(0,a.useMemo)(()=>o?.headerBar?.actions?.filter(h=>h?.pcShow),[o]),O=(0,a.useMemo)(()=>Q?.find(h=>h?.blockType===x.HeaderNavigationActionBlockType.Profile),[Q]),X=(0,a.useCallback)(()=>{b(h=>!h)},[]);return(0,a.useEffect)(()=>{if(p?.current){const h=p.current;return h.addEventListener("click",X),()=>{h.removeEventListener("click",X)}}},[X]),(0,J.useGSAP)(()=>{M?.open&&V.gsap.fromTo(D?.current,{height:0},{height:"auto"})},[M?.open]),(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[96px]",r),children:[(0,e.jsxs)("div",{ref:S,onClick:_,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)(ce,{}),(0,e.jsx)(Z,{ref:p,actions:Q,activeStatus:s})]}),(0,e.jsx)("div",{className:"flex justify-between",children:C?.map((h,H)=>(0,e.jsx)("div",{className:"flex gap-3",children:h?.map((B,R)=>(0,e.jsx)("div",{ref:I=>{z.current[H][R]=I},className:"group cursor-pointer",children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsxs)("div",{className:"flex items-center gap-1 pb-4",onClick:I=>j(I,H,R),children:[(0,e.jsx)(l.Text,{html:B.text,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-4 opacity-0 transition-opacity duration-500 group-hover:opacity-100",{"rotate-180":M?.groupIndex===H&&M?.index===R,"opacity-100":w&&M?.groupIndex===H&&M?.index===R})})]}),(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)]":M?.groupIndex===H&&M?.index===R},f==="dark"?"bg-white":"bg-[#080A0F]")})]})},B.id))},`groupCategory-${H}`))})]}),(0,e.jsxs)("div",{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:!(M?.open&&N)}),onMouseEnter:()=>i(!0),onMouseLeave:()=>i(!1),style:{height:`calc(100dvh - ${S?.current?.getBoundingClientRect()?.bottom}px)`},children:[(0,e.jsx)("div",{ref:D,className:(0,k.cn)("relative z-50",{"overflow-hidden":L!==x.HeaderNavigationBlockType.Supports}),children:F}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:_})]}),s&&(0,e.jsxs)("div",{className:"absolute left-0 top-full z-[999] flex h-dvh w-full bg-black/70",children:[(0,e.jsx)("div",{className:"absolute w-[272px] bg-white p-4",style:{right:`calc(100% - ${p?.current?.getBoundingClientRect()?.right}px)`,top:"-36px"},children:d?.email?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:d?.nick_name||O?.welcome,className:"text-sm font-bold"}),(0,e.jsx)("div",{className:"mt-2 h-px bg-[#D9D9D9]"}),(0,e.jsx)("div",{className:"mt-2",children:O?.profiles?.map(h=>(0,e.jsx)(U,{className:"py-2",label:h?.title,href:h?.url},h.id))})]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P.Polygon,{className:"absolute -top-2 right-[46px] z-30 text-white"}),(0,e.jsx)(l.Text,{html:O?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:O?.benefits?.map(h=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:h.benefitIcon?.url,className:"size-4",alt:h.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:h.benefit,className:"text-sm font-bold leading-[1.4]"})]},h.id))}),(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-2",children:[(0,e.jsx)(l.Button,{variant:"secondary",size:"lg",onClick:()=>m?.join?.(),children:(0,e.jsx)(l.Text,{html:O?.primaryButton||"Join Now",className:"font-bold"})}),(0,e.jsx)(l.Button,{variant:"primary",size:"lg",onClick:()=>m?.login?.(),children:(0,e.jsx)(l.Text,{html:O?.secondaryButton||"Log In",className:"font-bold"})})]})]})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>b(!1)})]})]})}),ne=a.default.memo(({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{buildProps:o,onSidebarNavClick:c}=(0,E.useNavContext)(),[r,f]=(0,a.useState)([]),[u,m]=(0,a.useState)(-1),d=(0,a.useRef)(null),w=(0,a.useCallback)(()=>{const v=t?.subcategories;if(!v?.length)return;const g=v.findIndex(s=>!!s?.subSubCategories),y=v.findIndex(s=>!s?.subSubCategories),p=v.map((s,b)=>({index:b,open:g===b||y===b}));f(p)},[t]);(0,a.useEffect)(()=>{w()},[w]);const i=(0,a.useMemo)(()=>{const v=t?.subcategories?.[r?.find(y=>y.open)?.index||0],g=n?.find(y=>y?.label?.toLowerCase()===v?.label?.toLowerCase())||{};if(v?.collections){const y=o?.categories?.[v?.collections]||{};return{label:g?.label,isCollection:!0,banner:g?.banner,primary:g?.primary,series:[{products:y?.products}]}}else if(v?.subSubCategories){const y=v?.subSubCategories?.[u],p=n?.find(s=>s?.label?.toLowerCase()===y?.label?.toLowerCase())||{};if(y?.collections){const s=o?.categories?.[y?.collections]||{};return{label:p?.label,isCollection:!0,banner:p?.banner,primary:p?.primary,series:[{products:s?.products}]}}else return p}else return g},[t,r,u,n]),C=(0,a.useCallback)((v,g)=>{if(g?.subSubCategories?.length>0?m(0):m(-1),g?.subSubCategories?.length>0)f(y=>y.map(p=>p.index===v?{...p,open:!0}:{...p,open:!1}));else{const p=t?.subcategories?.findIndex(s=>!!s?.subSubCategories);f(s=>s.map(b=>({...b,open:b.index===v||b.index===p})))}},[t,w]),N=(v,g)=>{f(y=>y.map(p=>p.index===v?{...p,open:!0}:{...p,open:!1})),m(g)};return(0,e.jsxs)(l.Container,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[(0,e.jsxs)("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:d,children:[(0,e.jsx)("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:t?.subcategories?.map((v,g)=>{const y=Array.isArray(v?.subSubCategories)&&v?.subSubCategories?.length>0;return(0,e.jsxs)("div",{children:[(0,e.jsxs)("div",{className:(0,k.cn)("flex cursor-pointer items-center justify-between",{"bg-[#F5F5F7]":!y&&r?.find(p=>p.index===g)?.open}),onClick:()=>{C(g,v),c?.(v,g)},children:[(0,e.jsx)(l.Text,{html:v.label,className:"p-4 text-sm font-bold leading-[1.4]"}),y&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-4",{"rotate-180":r?.find(p=>p.index===g)?.open})})]}),r?.find(p=>p.index===g)?.open&&(0,e.jsx)("div",{className:"flex flex-col",children:v.subSubCategories?.map((p,s)=>(0,e.jsx)(l.Text,{html:p.label,onClick:()=>{N(g,s),c?.(p,s)},className:(0,k.cn)("cursor-pointer px-6 py-4 text-sm font-bold leading-[1.4] text-[#6D6D6F] hover:bg-[#F5F5F7]",{"bg-[#F5F5F7]":u===s})},`subSubItem-${g}-${s}`))})]},`subcategoryItem-${g}`)})}),t&&(0,e.jsx)("div",{className:"flex",children:(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"lg-desktop:text-base text-sm",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"lg-desktop:text-base justify-start !p-0 text-sm",children:t?.secondary?.label})]})})]}),(0,e.jsxs)("div",{className:"flex-1 py-4",children:[Reflect.ownKeys(i).length>0&&(0,e.jsxs)("div",{className:"mb-4 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)(l.Text,{html:i?.label,className:"lg-desktop:text-2xl text-xl font-bold leading-[1.4]"}),i?.primary&&!i?.primary?.hide&&(0,e.jsx)(l.Button,{as:"a",href:`${i?.primary?.url}?ref=${i?.label}_viewmore`,variant:"link",size:"lg",className:"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline",children:i?.primary?.label})]}),(0,e.jsx)(l.Link,{href:i?.guide?.url,className:"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]",children:i?.guide?.label})]}),(0,e.jsx)("div",{className:"flex h-[426px] flex-col gap-4 overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:i?.series?.map((v,g)=>(0,e.jsxs)("div",{children:[v.label&&(0,e.jsx)(l.Text,{html:v.label,className:"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"grid grid-cols-3 gap-4",children:[!!i?.banner&&(0,e.jsx)(l.Link,{asChild:!i?.banner?.href,href:i?.banner?.href,children:(0,e.jsxs)("div",{className:"[&_img]:hover:duration-600 relative [&_img]:hover:scale-110 [&_img]:hover:transition-all",children:[(0,e.jsx)(l.Picture,{source:i?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:i?.banner?.title||"Buy in Guide",className:"font-bold text-white"}),(0,e.jsx)(l.Text,{html:i?.banner?.desc||"20.000mAh",className:"text-sm font-bold text-white"})]})]})}),v.products?.map((y,p)=>(0,e.jsx)(le,{seriesLabel:i?.label,product:y,isCollection:i?.isCollection},`seriesProductItem-${p}`))]})]},`seriesItem-${g}`))})]})]})}),we=({multicolMetadata:t})=>{const n=(0,a.useRef)(null);return(0,e.jsx)("div",{ref:n,children:(0,e.jsx)(l.Container,{childClassName:"bg-white",className:"h-full",children:(0,e.jsx)("div",{className:"flex gap-4 py-4",children:t?.map((o,c)=>(0,e.jsx)("div",{className:"w-1/4",children:(0,e.jsx)(oe,{item:o})},`multicolItem-${o?.label}-${c}`))})})})},Ce=({supportsMetadata:t,currentNavItemRef:n})=>{const o=(0,a.useRef)(null),[c,r]=(0,a.useState)(null),[f,u]=(0,a.useState)(0);(0,a.useEffect)(()=>{if(o?.current){const d=o?.current?.getBoundingClientRect();u(d.height)}},[o]);const m=(0,me.debounce)(()=>{if(n){const d=n.getBoundingClientRect();r(d)}},500);return(0,a.useEffect)(()=>(m(),window.addEventListener("resize",m),()=>{window.removeEventListener("resize",m)}),[m]),(0,a.useEffect)(()=>{if(n){const d=n.getBoundingClientRect();r(d)}},[n]),(0,e.jsx)("div",{className:"absolute top-0 h-full overflow-hidden bg-white transition-all duration-500",style:{right:`calc(100% - ${c?.right}px)`,height:f},children:(0,e.jsx)("div",{ref:o,className:"p-4",children:t?.map(d=>(0,e.jsx)("div",{className:"py-2",children:(0,e.jsx)(l.Link,{href:d.url,className:"text-sm font-bold leading-[1.4] no-underline",children:d.label})},d.id))})})},le=({product:t,isCollection:n,position:o,seriesLabel:c})=>{const{buildProps:r,onSeriesProductClick:f}=(0,E.useNavContext)();let u=n?t:r?.products?.find(i=>i.handle===t.handle);const m=u?.variants?.find(i=>i.sku===t.sku)||u?.variants?.[0],d=(0,a.useMemo)(()=>`/products/${u?.handle}?variant=${(0,k.atobID)(m?.id)}`,[u?.handle,m?.id]),w=(0,a.useMemo)(()=>u?.tags?.filter?.(i=>i?.startsWith?.("CLtag"))?.map?.(i=>i?.replace?.("CLtag:",""))?.slice?.(0,2),[u?.tags]);return m?.availableForSale?(0,e.jsx)(l.Link,{href:d,onClick:i=>{i.preventDefault(),window.open(d),f?.(u,o||0,c)},className:"no-underline hover:text-current",children:(0,e.jsxs)("div",{className:"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110",children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)(l.Picture,{source:`${m?.image?.url||t?.images?.[0]?.url}}`,width:90,height:90,className:"size-[96px]",imgClassName:"object-contain h-full"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:"flex gap-1",children:Array.isArray(w)&&w?.map((i,C)=>(0,e.jsx)(l.Text,{as:"p",html:i,className:"text-brand-0 mb-1 inline-block h-[24px] whitespace-nowrap rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]"},C))}),(0,e.jsx)(l.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:u?.title||t?.name}),t?.desc&&(0,e.jsx)(l.Text,{as:"p",html:t?.desc,className:"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]})}):null},oe=({item:t,allPicture:n})=>(0,e.jsxs)(e.Fragment,{children:[t?.columns&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:t.label,as:"div",className:"my-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col",children:t.columns?.map(o=>(0,e.jsxs)("div",{className:"flex items-center gap-1 py-2",children:[(0,e.jsx)(l.Link,{href:`${o.url}?ref=navMenu`,asChild:!o.url,className:"text-sm font-bold leading-[1.4] no-underline",children:o.label}),o?.badge&&(0,e.jsx)(l.Text,{as:"p",html:o?.badge||"badge",className:"text-brand-0 h-[24px] rounded-full border-[1.6px] border-[var(--brand-color-0)] px-[6px] text-sm font-bold !leading-[22px]"})]},o.label))})]}),t?.imageUrl&&(0,e.jsx)("div",{className:(0,k.cn)("laptop:h-[280px] desktop:h-[224px] lg-desktop:h-[280px] tablet:max-w-[346px] laptop:max-w-[440px] desktop:w-full relative h-[240px] max-w-[358px] overflow-hidden",{"tablet:max-w-none laptop:max-w-none":n}),children:(0,e.jsxs)(l.Link,{href:`${t.url}?ref=navMenu`,asChild:!t.url,children:[(0,e.jsx)(l.Picture,{source:t.imageUrl,width:404,height:280,className:"size-full",imgClassName:"object-cover h-full hover:scale-105 transition-all duration-300"}),(0,e.jsxs)("div",{className:"absolute bottom-4 left-4 z-10 flex flex-col justify-end no-underline",children:[(0,e.jsx)(l.Text,{html:t.title,className:(0,k.cn)("lg-desktop:text-2xl text-xl font-bold leading-[1.2] text-white",{"text-black":t?.theme==="dark"})}),t.subtitle&&(0,e.jsx)(l.Text,{html:t.subtitle,className:(0,k.cn)("text-sm font-bold leading-[1.4] text-white",{"text-black":t?.theme==="dark"})}),t?.primary?.label&&(0,e.jsx)(l.Button,{as:"a",href:t?.primary?.url,variant:"link",size:"lg",className:(0,k.cn)("mr-auto !p-0 text-sm font-bold leading-[1.4] text-white",{"text-black":t?.theme==="dark"}),children:t?.primary?.label||"more"})]})]})})]}),re=(0,a.forwardRef)(({data:t,className:n,onPrimaryNavClick:o},c)=>{const r=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(t?.categories?.filter(L=>L?.mobileShow)),[t]),{currentMenu:f,setCurrentMenu:u,subSubCategory:m}=(0,E.useNavContext)(),[d,w]=(0,a.useState)(!1),[i,C]=(0,a.useState)(0),[N,v]=(0,a.useState)(null),g=(0,a.useRef)(null);(0,a.useEffect)(()=>{if(g?.current&&d){const L=g?.current?.getBoundingClientRect();C(window?.innerHeight-(L?.bottom||0))}},[d]),(0,J.useGSAP)(()=>{V.gsap.fromTo(g.current,{height:0},{height:i,duration:.3})},[i]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=d?"hidden":"auto"},[d]);const y=(0,a.useMemo)(()=>N?.components?.[0]?.blockType,[N]),p=(0,T.WithSupports)(Me,{categoriesItem:N}),s=(0,T.WithSidebar)(De,N),b=(0,T.WithMulticol)(Le,N),S=(0,a.useMemo)(()=>{switch(y){case x.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(s,{});case x.HeaderNavigationBlockType.Supports:return(0,e.jsx)(p,{});case x.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(b,{});default:return null}},[y,N,p]),D=(0,a.useCallback)(()=>{w(!1),C(0),u&&u(x.HeaderNavigationMenu.Primary)},[w,C,u]),z=(0,a.useMemo)(()=>t?.headerBar?.actions?.filter(L=>L?.mobileShow&&L?.blockType!==x.HeaderNavigationActionBlockType.Profile),[t]),M=(0,a.useMemo)(()=>t?.headerBar?.actions?.find(L=>L?.mobileShow&&L?.blockType===x.HeaderNavigationActionBlockType.Profile)||{},[t]),j=(0,a.useMemo)(()=>{switch(f){case x.HeaderNavigationMenu.Primary:return(0,e.jsx)(ze,{actions:z,menuOpen:d,onMenuOpenClose:()=>{w(!1),C(0)},onMenuOpenClick:()=>w(!0)});case x.HeaderNavigationMenu.Secondary:return(0,e.jsx)(de,{title:N?.text,onMenuOpenClose:D,onMenuBackClick:()=>u?.(x.HeaderNavigationMenu.Primary)});case x.HeaderNavigationMenu.Third:return(0,e.jsx)(de,{title:m?.label,onMenuOpenClose:D,onMenuBackClick:()=>u?.(x.HeaderNavigationMenu.Secondary)});default:return null}},[d,f,u,N,z,m,D]),_=(0,a.useCallback)((L,$)=>{const A=Array.isArray(r)?Array.isArray(r[L])?r[L][$]:{}:{};v(A),A?.components?.[0]?.blockType===x.HeaderNavigationBlockType.Links?A?.components?.[0]?.url&&window.open(A?.components?.[0]?.url):u?.(x.HeaderNavigationMenu.Secondary)},[r,u]);return(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[52px]",n),children:[j,d&&(0,e.jsx)("div",{ref:g,className:"absolute left-0 top-full z-[999] w-full overflow-y-auto border-t border-[#E4E5E6] bg-white text-black",style:{height:i},children:f===x.HeaderNavigationMenu.Primary?(0,e.jsx)(Se,{categories:r,onPrimaryMenuClick:_,onPrimaryNavClick:o,profileAction:M}):S})]})}),Se=({categories:t,onPrimaryMenuClick:n,profileAction:o,onPrimaryNavClick:c})=>{const{onSidebarNavClick:r}=(0,E.useNavContext)();return(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:t?.map((f,u)=>(0,e.jsxs)("div",{className:"",children:[f?.map((m,d)=>(0,e.jsx)(U,{label:m.text,onClick:()=>{const i=(t?.flat()||[])?.findIndex(C=>C?.id===t[u][d]?.id);n(u,d),c?.(m,i)},icon:m.components?.[0]?.icon},m.id)),(0,e.jsx)("div",{className:(0,k.cn)("my-2 h-px w-full bg-[#E5E5E7]",{hidden:u===t.length-1})})]},`groupCategory-${u}`))}),(0,e.jsx)(Pe,{profileAction:o})]})},De=({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{currentMenu:o,setCurrentMenu:c,subSubCategory:r,setSubSubCategory:f,setCurrentSeriesMetadata:u,currentSeriesMetadata:m,buildProps:d,onSidebarNavClick:w}=(0,E.useNavContext)(),[i,C]=(0,a.useState)([]),[N,v]=(0,a.useState)([]);(0,a.useEffect)(()=>{t?.subcategories?.length&&C(t?.subcategories?.map((s,b)=>({index:b,open:!1})))},[t]),(0,a.useEffect)(()=>{r?.subSubCategories?.length&&v(r?.subSubCategories?.map((s,b)=>({index:b,open:b===0})))},[r]);const g=(0,a.useCallback)((s,b)=>{c&&c(x.HeaderNavigationMenu.Third),f?.(s);const S=n?.find(D=>b!==void 0?s?.subSubCategories?.[b]?.label?.toLowerCase()===D.label?.toLowerCase():s?.label?.toLowerCase()===D.label?.toLowerCase())||{};if(s?.collections){const D=d?.categories?.[s?.collections]||{};u?.({label:S?.label,isCollection:!0,banner:S?.banner,primary:S?.primary,series:[{products:D?.products}]})}else u?.(S)},[n,t,c,f,u]),y=(0,a.useMemo)(()=>n?.find(s=>!!s?.guide)?.guide,[n,t]);return(0,a.useMemo)(()=>{switch(o){case x.HeaderNavigationMenu.Secondary:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 tablet:justify-start tablet:gap-16 flex h-full flex-col justify-between p-4",children:[(0,e.jsx)("div",{children:t?.subcategories?.map((s,b)=>(0,e.jsx)("div",{children:(0,e.jsx)(U,{label:s?.label,active:i.find(S=>S.index===b)?.open,onClick:()=>{g(s),w?.(s,b)}})},`${s.label}-${b}`))}),(0,e.jsxs)("div",{className:"tablet:items-start flex flex-col items-center gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"tablet:w-auto w-full text-base",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"tablet:w-auto tablet:px-0 w-full py-0 text-base",children:t?.secondary?.label})]})]});case x.HeaderNavigationMenu.Third:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:[r?.subSubCategories?r?.subSubCategories?.map((s,b)=>{const S=n?.find(z=>z.label.toLowerCase()===s?.label?.toLowerCase())||{};let D={};if(s?.collections){const z=d?.categories?.[s?.collections]||{};D={label:S?.label,isCollection:!0,banner:S?.banner,primary:S?.primary,series:[{products:z?.products}]}}else D=S;return(0,e.jsxs)("div",{children:[Reflect.ownKeys(s).length>0&&(0,e.jsx)(se,{matchSeriesMetadata:D,onSubSubCategoryItemClick:()=>{w?.(s,b),v(z=>z.map((M,j)=>({...M,open:j===b?!M.open:M.open})))},expanded:!!N?.find(z=>z.index===b)?.open}),N?.find(z=>z.index===b)?.open&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(ie,{matchSeriesMetadata:D}),D?.primary&&(0,e.jsx)("div",{className:"my-4 text-center",children:(0,e.jsx)(l.Button,{as:"a",href:D?.primary?.url,className:"text-base leading-[1.2] no-underline",variant:"secondary",size:"base",children:D?.primary?.label})})]})]},`${s.label}-${b}`)}):(0,e.jsxs)(e.Fragment,{children:[Reflect.ownKeys(m).length>0&&(0,e.jsx)(se,{matchSeriesMetadata:m}),(0,e.jsx)(ie,{matchSeriesMetadata:m}),m?.primary&&(0,e.jsx)("div",{className:"my-4 text-center ",children:(0,e.jsx)(l.Button,{as:"a",href:`${m?.primary?.url}?ref=${m?.label}_viewmore`,variant:"secondary",size:"base",className:"text-base leading-[1.2] no-underline",children:m?.primary?.label})})]}),y&&(0,e.jsx)(l.Link,{href:y?.url,children:(0,e.jsx)("div",{className:"mt-4",children:(0,e.jsx)(l.Text,{html:y?.label,className:"text-sm font-bold leading-[1.2] text-[#6D6D6F]"})})})]});default:return null}},[o,t,c,n,i,N,f,r,u,m])},se=({matchSeriesMetadata:t,onSubSubCategoryItemClick:n,expanded:o})=>(0,e.jsxs)("div",{className:"tablet:pt-0 flex items-center justify-between py-4",onClick:n,children:[t?.label&&(0,e.jsx)(l.Text,{html:t?.label,className:"text-sm font-bold leading-[1.4]"}),n&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-5",{"rotate-180":o})})]}),ie=({matchSeriesMetadata:t})=>(0,e.jsx)("div",{className:"laptop:gap-3 flex flex-col gap-2",children:!!t?.series?.length&&t?.series?.map((n,o)=>(0,e.jsxs)("div",{children:[n.label&&(0,e.jsx)(l.Text,{html:n.label,className:"mb-2 text-sm font-bold leading-[1.4] text-[#3D3D3F]"}),(0,e.jsxs)("div",{className:"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2",children:[!!t?.banner&&(0,e.jsx)(l.Link,{asChild:!t?.banner?.href,href:t?.banner?.href,children:(0,e.jsxs)("div",{className:"[&_img]:hover:duration-600 relative [&_img]:hover:scale-110 [&_img]:hover:transition-all",children:[(0,e.jsx)(l.Picture,{source:t?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:t?.banner?.title||"Buy in Guide",className:(0,k.cn)("font-bold text-white",{"text-black":t?.banner?.theme==="dark"})}),(0,e.jsx)(l.Text,{html:t?.banner?.desc||"20.000mAh",className:(0,k.cn)("text-sm font-bold text-white",{"text-black":t?.banner?.theme==="dark"})})]})]})}),n.products?.map((c,r)=>(0,e.jsx)(le,{position:r,product:c,seriesLabel:t?.label,isCollection:t?.isCollection},`seriesProductItem-${o}-${r}`))]})]},`seriesItem-${o}`))}),Me=({supportsMetadata:t})=>(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:t?.map(n=>(0,e.jsx)(U,{href:n.url,label:n.label,onClick:()=>{}},n.id))}),Le=({multicolMetadata:t})=>{const n=(0,a.useMemo)(()=>!t?.some(o=>!!o.columns),[t]);return(0,e.jsx)("div",{className:(0,k.cn)("tablet:py-4 tablet:px-8 laptop:px-16 tablet:gap-6 flex flex-col gap-4 p-4",{"tablet:grid tablet:grid-cols-2 tablet:gap-3 laptop:gap-4":n}),children:t?.map((o,c)=>(0,e.jsx)("div",{children:(0,e.jsx)(oe,{item:o,allPicture:n})},`multicolItem-${o?.label}-${c}`))})},Pe=({profileAction:t})=>{const[n,o]=(0,a.useState)(!1),{profile:c,event:r}=(0,E.useNavContext)();return(0,e.jsxs)("div",{className:(0,k.cn)("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":n}),children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",onClick:()=>o(!n),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)(P.User,{})}),(0,e.jsx)(l.Text,{html:c?.nick_name||t?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!c?.email&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("laptop:size-4 size-5",{"rotate-180":n})})]}),c?.email&&(0,e.jsx)("div",{className:"mt-4",children:t?.profiles?.map(f=>(0,e.jsx)(U,{label:f?.title,href:f?.url},f.id))}),n&&!c?.email&&(0,e.jsxs)("div",{className:"mt-4",children:[(0,e.jsx)(l.Text,{html:t?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:t?.benefits?.map(f=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:f.benefitIcon?.url,className:"size-4",alt:f.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:f.benefit,className:"text-sm font-bold leading-[1.4]"})]},f.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:()=>r?.join?.(),children:(0,e.jsx)(l.Text,{html:t?.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:()=>r?.login?.(),children:(0,e.jsx)(l.Text,{html:t?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},ze=({menuOpen:t,onMenuOpenClose:n,onMenuOpenClick:o,actions:c})=>(0,e.jsxs)("div",{className:"flex h-full items-center justify-between gap-4",children:[(0,e.jsx)(ce,{}),(0,e.jsxs)("div",{className:"desktop:gap-6 flex items-center gap-4",children:[(0,e.jsx)(Z,{actions:c}),t?(0,e.jsx)(P.Close,{className:"size-5",onClick:()=>n()}):(0,e.jsx)(P.Menu,{className:"size-5",onClick:()=>o()})]})]}),ce=()=>{const{payloadData:t,isMobile:n}=(0,E.useNavContext)();return(0,e.jsx)("div",{className:"hover:text-brand-0 cursor-pointer [&>svg]:w-full",onClick:()=>{window.location.href="/"},dangerouslySetInnerHTML:{__html:n?t?.headerBar?.mobileLogo:t?.headerBar?.desktopLogo}})},Z=(0,a.forwardRef)(({actions:t,activeStatus:n=!1},o)=>{const{event:c,cartCount:r}=(0,E.useNavContext)(),[f,u]=(0,a.useState)(null),m=(0,a.useCallback)((d,w)=>{switch(u(w),d?.blockType){case x.HeaderNavigationActionBlockType.Search:c?.search?.();break;case x.HeaderNavigationActionBlockType.Cart:c?.cart?.();break;case x.HeaderNavigationActionBlockType.Profile:c?.profile?.();break;case x.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(t)&&t?.map((d,w)=>(0,e.jsxs)("div",{className:"relative",ref:d.blockType===x.HeaderNavigationActionBlockType.Profile?o:null,onClick:()=>m(d,w),children:[(0,e.jsx)(l.Text,{html:d.icon,className:(0,k.cn)("size-5 cursor-pointer",{"text-brand-0":n&&f===w})}),d.blockType===x.HeaderNavigationActionBlockType.Cart&&r>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]",children:(0,e.jsx)(l.Text,{html:r?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},d.id))})}),de=({title:t,onMenuOpenClose:n,onMenuBackClick:o})=>(0,e.jsxs)("div",{className:"flex h-full items-center gap-3",children:[(0,e.jsx)(P.LeftArrow,{className:"size-5",onClick:()=>o()}),(0,e.jsx)(l.Text,{html:t,className:"flex-1 text-center text-base font-bold leading-[1.4]"}),(0,e.jsx)(P.Close,{className:"size-5",onClick:()=>n()})]}),U=({label:t,href:n,onClick:o,active:c,icon:r,className:f})=>(0,e.jsx)("div",{className:(0,k.cn)("flex cursor-pointer items-center justify-between py-4",f),onClick:o,children:(0,e.jsxs)(l.Link,{href:n,asChild:!n,className:"flex w-full items-center justify-between no-underline",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(l.Text,{html:t,className:(0,k.cn)("text-sm font-bold leading-[1.4]",{underline:r})}),r&&(0,e.jsx)(l.Text,{html:r})]}),(0,e.jsx)(P.RightArrow,{className:(0,k.cn)("laptop:size-4 size-5",{"rotate-90":c})})]})});re.displayName="MobileNavigation",Z.displayName="Actions",te.displayName="HeaderNavigation",ae.displayName="DesktopNavigation",ne.displayName="SidebarDropdown";var He=(0,ue.withLayout)(te);
+"use strict";"use client";var ge=Object.create;var U=Object.defineProperty;var ye=Object.getOwnPropertyDescriptor;var he=Object.getOwnPropertyNames;var xe=Object.getPrototypeOf,Ne=Object.prototype.hasOwnProperty;var ke=(t,n)=>{for(var r in n)U(t,r,{get:n[r],enumerable:!0})},Z=(t,n,r,s)=>{if(n&&typeof n=="object"||typeof n=="function")for(let d of he(n))!Ne.call(t,d)&&d!==r&&U(t,d,{get:()=>n[d],enumerable:!(s=ye(n,d))||s.enumerable});return t};var G=(t,n,r)=>(r=t!=null?ge(xe(t)):{},Z(n||!t||!t.__esModule?U(r,"default",{value:t,enumerable:!0}):r,t)),we=t=>Z(U({},"__esModule",{value:!0}),t);var Be={};ke(Be,{default:()=>He});module.exports=we(Be);var e=require("react/jsx-runtime"),a=G(require("react")),l=require("../../components/index.js"),de=require("../../shared/Styles.js"),N=require("../../helpers/utils.js"),$=G(require("./NavProvider.js")),g=require("./types.js"),ue=require("es-toolkit"),pe=G(require("jump.js")),J=require("@gsap/react"),V=require("gsap"),T=require("./withCategory.js"),z=require("./icons/index.js"),me=G(require("../NavigationSearch/index.js"));const ee=(0,a.forwardRef)((t,n)=>{const{data:{header:r}={},buildProps:s,event:d,profile:m,theme:f="light",isTop:u=!1,searchResult:x,onSearch:y,isSearching:o,keywords:M,onPrimaryNavClick:C,onSeriesProductClick:p,onSidebarNavClick:k,headerId:v,cartCount:h,menuData:c}=t,[b,D]=(0,a.useState)(!1),[L,P]=(0,a.useState)(!1),S=(0,a.useRef)(null),B=(0,a.useRef)(null),F=()=>{const w=document?.querySelector("body")?.offsetWidth||0;P(w<=1440)};(0,a.useEffect)(()=>(F(),window.addEventListener("resize",F),()=>{window.removeEventListener("resize",F)}),[]),(0,a.useImperativeHandle)(n,()=>B.current),(0,a.useEffect)(()=>{B.current&&u&&(0,pe.default)(B.current,{duration:0,offset:B.current?.getBoundingClientRect()?.bottom||0})},[u]),(0,a.useEffect)(()=>{d&&(d.search=()=>D(!0))},[d]),(0,J.useGSAP)(()=>{S?.current&&b&&V.gsap.fromTo(S.current,{height:0},{height:"auto",duration:.3})},[b]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=b?"hidden":"auto"},[b]);const j=(0,a.useMemo)(()=>r?.bar?.actions?.find(w=>w?.blockType===g.HeaderNavigationActionBlockType.Search)?.searchBar?.[0]||{},[r]);return(0,e.jsx)($.default,{buildProps:s,profile:m,isMobile:L,event:d,payloadData:r,onSidebarNavClick:k,onSeriesProductClick:p,cartCount:h,children:(0,e.jsx)("header",{id:v||"header","data-ui-component-id":"HeaderNavigation",className:"relative z-[100] bg-white",ref:B,children:(0,e.jsxs)("div",{className:(0,N.cn)("hover:bg-white hover:text-black",f==="light"?"text-black":"text-white",{}),children:[(0,e.jsx)(te,{data:r,className:"desktop:block hidden !bg-white",theme:f,onPrimaryNavClick:C}),(0,e.jsx)(re,{menuData:c,data:r,className:"desktop:hidden block !bg-white",onPrimaryNavClick:C}),b&&(0,e.jsxs)("div",{className:"absolute left-0 top-0 z-[60] flex w-full flex-col bg-black/70",style:{height:`calc(100dvh - ${B?.current?.getBoundingClientRect()?.top}px)`},role:"dialog","aria-modal":"true","aria-label":"Search",children:[(0,e.jsx)("div",{ref:S,className:(0,N.cn)("overflow-y-auto",{}),children:(0,e.jsx)(me.default,{data:j,keywords:M,isSearching:o,searchResult:x,onSearch:w=>{y?.(w)},onClose:()=>{y?.(),D(!1)}})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>D(!1),role:"button",tabIndex:0,"aria-label":"Close search",onKeyDown:w=>{(w.key==="Enter"||w.key===" "||w.key==="Escape")&&(w.preventDefault(),D(!1))}})]})]})})})}),te=(0,a.forwardRef)((t,n)=>{const{data:r,onNavItemClick:s,className:d,theme:m,onPrimaryNavClick:f}=t,{event:u,profile:x}=(0,$.useNavContext)(),[y,o]=(0,a.useState)(!1),M=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(r?.categories?.filter(i=>i?.pcShow)),[r]),[C,p]=(0,a.useState)(null),[k,v]=(0,a.useState)([]),h=(0,a.useRef)(null),[c,b]=(0,a.useState)(!1),D=(0,a.useRef)(null),L=(0,a.useRef)(null),P=(0,a.useRef)(M.map(i=>Array(i?.length||0).fill(null)));(0,a.useEffect)(()=>{M?.length&&v(M?.map((i,E)=>i?.map((H,A)=>({groupIndex:E,index:A,open:!1}))))},[M]);const S=(0,a.useMemo)(()=>{let i=null;for(const E of k){for(const H of E)if(H.open){i=H;break}if(i)break}return i},[k]);(0,a.useEffect)(()=>{document.documentElement.style.overflow=S?.open||c?"hidden":"auto"},[S?.open,c]);const B=(i,E,H)=>{if(b(!1),C?.components?.[0]?.blockType===g.HeaderNavigationBlockType.Links)C?.components?.[0]?.url&&window.open(C?.components?.[0]?.url);else{const A=M?.flat()||[],_=A?.findIndex(R=>R?.id===M[E][H]?.id);i.stopPropagation(),s?.(),f?.(A[_],_),p(M[E][H]),v(R=>R.map(ve=>ve.map(W=>W.groupIndex===E&&W.index===H?{...W,open:!W.open}:{...W,open:!1})))}},F=(i,E,H)=>{i.key==="Enter"||i.key===" "?(i.preventDefault(),B(i,E,H)):i.key==="Escape"&&S?.groupIndex===E&&S?.index===H&&(i.preventDefault(),j())},j=()=>{v(i=>i.map(E=>E.map(H=>({...H,open:!1}))))},w=(0,a.useMemo)(()=>{if(C)return C?.components?.[0]?.blockType},[C]),q=(0,T.WithSidebar)(ae,C),O=(0,T.WithMulticol)(Ce,C),be=(0,T.WithSupports)(Se,{categoriesItem:C,currentNavItemRef:P.current?.[S?.groupIndex||0]?.[S?.index||0]}),fe=(0,a.useMemo)(()=>{switch(w){case g.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(q,{});case g.HeaderNavigationBlockType.Supports:return(0,e.jsx)(be,{});case g.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(O,{});default:return null}},[w,C]),Q=(0,a.useMemo)(()=>r?.bar?.actions?.filter(i=>i?.pcShow),[r]),I=(0,a.useMemo)(()=>Q?.find(i=>i?.blockType===g.HeaderNavigationActionBlockType.Profile),[Q]),X=(0,a.useCallback)(()=>{b(i=>!i)},[]);return(0,a.useEffect)(()=>{if(h?.current){const i=h.current;return i.addEventListener("click",X),()=>{i.removeEventListener("click",X)}}},[X]),(0,J.useGSAP)(()=>{S?.open&&V.gsap.fromTo(L?.current,{height:0},{height:"auto"})},[S?.open]),(0,e.jsxs)(l.Container,{className:(0,N.cn)("relative h-[96px]",d),children:[(0,e.jsxs)("div",{ref:D,onClick:j,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)(se,{}),(0,e.jsx)(Y,{ref:h,actions:Q,activeStatus:c})]}),(0,e.jsx)("nav",{className:"flex justify-between",role:"navigation","aria-label":"Primary navigation",children:M?.map((i,E)=>(0,e.jsx)("div",{className:"flex gap-3",children:i?.map((H,A)=>{const _=S?.groupIndex===E&&S?.index===A;return(0,e.jsx)("div",{ref:R=>{P.current[E][A]=R},className:"group cursor-pointer",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:R=>B(R,E,A),onKeyDown:R=>F(R,E,A),"aria-expanded":_,"aria-haspopup":"true","aria-label":H.text,children:[(0,e.jsx)(l.Text,{html:H.text,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)(z.DownArrow,{"aria-hidden":"true",className:(0,N.cn)("size-4 opacity-0 transition-opacity duration-500 group-hover:opacity-100",{"rotate-180":_,"opacity-100":y&&_})})]}),(0,e.jsx)("div",{className:(0,N.cn)("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":_},m==="dark"?"bg-white":"bg-[#080A0F]"),"aria-hidden":"true"})]})},H.id)})},`groupCategory-${E}`))})]}),(0,e.jsxs)("div",{role:"menu","aria-hidden":!(S?.open&&C),className:(0,N.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:!(S?.open&&C)}),onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:{height:`calc(100dvh - ${D?.current?.getBoundingClientRect()?.bottom}px)`},children:[(0,e.jsx)("div",{ref:L,className:(0,N.cn)("relative z-50",{"overflow-hidden":w!==g.HeaderNavigationBlockType.Supports}),children:fe}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:j,role:"button",tabIndex:0,"aria-label":"Close menu",onKeyDown:i=>{(i.key==="Enter"||i.key===" "||i.key==="Escape")&&(i.preventDefault(),j())}})]}),c&&(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:"absolute w-[272px] bg-white p-4",style:{right:`calc(100% - ${h?.current?.getBoundingClientRect()?.right}px)`,top:"-36px"},children:x?.email?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:x?.nick_name||I?.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:I?.profiles?.map(i=>(0,e.jsx)(K,{className:"py-2",label:i?.title,href:i?.url},i.id))})]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(z.Polygon,{className:"absolute -top-2 right-[46px] z-30 text-white","aria-hidden":"true"}),(0,e.jsx)(l.Text,{html:I?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:I?.benefits?.map(i=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:i.benefitIcon?.url,className:"size-4",alt:i.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:i.benefit,className:"text-sm font-bold leading-[1.4]"})]},i.id))}),(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-2",children:[(0,e.jsx)(l.Button,{variant:"secondary",size:"lg",onClick:()=>u?.join?.(),children:(0,e.jsx)(l.Text,{html:I?.primaryButton||"Join Now",className:"font-bold"})}),(0,e.jsx)(l.Button,{variant:"primary",size:"lg",onClick:()=>u?.login?.(),children:(0,e.jsx)(l.Text,{html:I?.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:i=>{(i.key==="Enter"||i.key===" "||i.key==="Escape")&&(i.preventDefault(),b(!1))}})]})]})}),ae=a.default.memo(({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{buildProps:r,onSidebarNavClick:s}=(0,$.useNavContext)(),[d,m]=(0,a.useState)([]),[f,u]=(0,a.useState)(-1),x=(0,a.useRef)(null),y=(0,a.useCallback)(()=>{const p=t?.subcategories;if(!p?.length)return;const k=p.findIndex(c=>!!c?.subSubCategories),v=p.findIndex(c=>!c?.subSubCategories),h=p.map((c,b)=>({index:b,open:k===b||v===b}));m(h)},[t]);(0,a.useEffect)(()=>{y()},[y]);const o=(0,a.useMemo)(()=>{const p=t?.subcategories?.[d?.find(v=>v.open)?.index||0],k=n?.find(v=>v?.label?.toLowerCase()===p?.label?.toLowerCase())||{};if(p?.collections){const v=r?.categories?.[p?.collections]||{};return{label:k?.label,isCollection:!0,banner:k?.banner,primary:k?.primary,series:[{products:v?.products}]}}else if(p?.subSubCategories){const v=p?.subSubCategories?.[f],h=n?.find(c=>c?.label?.toLowerCase()===v?.label?.toLowerCase())||{};if(v?.collections){const c=r?.categories?.[v?.collections]||{};return{label:h?.label,isCollection:!0,banner:h?.banner,primary:h?.primary,series:[{products:c?.products}]}}else return h}else return k},[t,d,f,n,r]),M=(0,a.useCallback)((p,k)=>{k?.subSubCategories?.length>0?u(0):u(-1),m(v=>v.map((h,c)=>({...h,open:c===p?!h.open:!1})))},[]),C=(p,k)=>{m(v=>v.map(h=>h.index===p?{...h,open:!0}:{...h,open:!1})),u(k)};return(0,e.jsxs)(l.Container,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[(0,e.jsxs)("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:x,children:[(0,e.jsx)("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:t?.subcategories?.map((p,k)=>{const v=Array.isArray(p?.subSubCategories)&&p?.subSubCategories?.length>0,h=d?.find(c=>c.index===k)?.open;return(0,e.jsxs)("div",{children:[(0,e.jsxs)("button",{className:(0,N.cn)("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left",{"bg-[#F5F5F7]":!v&&h}),onClick:()=>{M(k,p),s?.(p,k)},"aria-expanded":v?h:void 0,"aria-haspopup":v?"true":void 0,children:[(0,e.jsx)(l.Text,{html:p.label,className:"p-4 text-sm font-bold leading-[1.4]"}),v&&(0,e.jsx)(z.DownArrow,{"aria-hidden":"true",className:(0,N.cn)("size-4",{"rotate-180":h})})]}),h&&(0,e.jsx)("div",{className:"flex flex-col",role:"menu",children:p.subSubCategories?.map((c,b)=>(0,e.jsx)("button",{onClick:()=>{C(k,b),s?.(c,b)},className:(0,N.cn)("w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]",{"bg-[#F5F5F7]":f===b}),role:"menuitem","aria-label":c.label,children:(0,e.jsx)(l.Text,{html:c.label,className:"text-sm font-bold leading-[1.4] text-[#6D6D6F]"})},`subSubItem-${k}-${b}`))})]},`subcategoryItem-${k}`)})}),t&&(0,e.jsx)("div",{className:"flex",children:(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"lg-desktop:text-base text-sm",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"lg-desktop:text-base justify-start !p-0 text-sm",children:t?.secondary?.label})]})})]}),(0,e.jsxs)("div",{className:"flex-1 py-4",children:[Reflect.ownKeys(o).length>0&&(0,e.jsxs)("div",{className:"mb-4 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)(l.Text,{html:o?.label,className:"lg-desktop:text-2xl text-xl font-bold leading-[1.4]"}),o?.primary&&!o?.primary?.hide&&(0,e.jsx)(l.Button,{as:"a",href:`${o?.primary?.url}?ref=${o?.label}_viewmore`,variant:"link",size:"lg",className:"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline",children:o?.primary?.label})]}),(0,e.jsx)(l.Link,{href:o?.guide?.url,className:"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]",children:o?.guide?.label})]}),(0,e.jsx)("div",{className:"flex h-[426px] flex-col gap-4 overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:o?.series?.map((p,k)=>(0,e.jsxs)("div",{children:[p.label&&(0,e.jsx)(l.Text,{html:p.label,className:"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"grid grid-cols-3 gap-4",children:[!!o?.banner&&(0,e.jsx)(l.Link,{asChild:!o?.banner?.href,href:o?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(l.Picture,{source:o?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:o?.banner?.title||"Buy in Guide",className:"font-bold text-white"}),(0,e.jsx)(l.Text,{html:o?.banner?.desc||"20.000mAh",className:"text-sm font-bold text-white"})]})]})}),p.products?.map((v,h)=>(0,e.jsx)(ne,{seriesLabel:o?.label,product:v,isCollection:o?.isCollection},`seriesProductItem-${h}`))]})]},`seriesItem-${k}`))})]})]})}),Ce=({multicolMetadata:t})=>{const n=(0,a.useRef)(null);return(0,e.jsx)("div",{ref:n,children:(0,e.jsx)(l.Container,{childClassName:"bg-white",className:"h-full",children:(0,e.jsx)("div",{className:"flex gap-4 py-4",children:t?.map((r,s)=>(0,e.jsx)("div",{className:"w-1/4",children:(0,e.jsx)(le,{item:r})},`multicolItem-${r?.label}-${s}`))})})})},Se=({supportsMetadata:t,currentNavItemRef:n})=>{const r=(0,a.useRef)(null),[s,d]=(0,a.useState)(null),[m,f]=(0,a.useState)(0);(0,a.useEffect)(()=>{if(r?.current){const x=r?.current?.getBoundingClientRect();f(x.height)}},[r]);const u=(0,ue.debounce)(()=>{if(n){const x=n.getBoundingClientRect();d(x)}},500);return(0,a.useEffect)(()=>(u(),window.addEventListener("resize",u),()=>{window.removeEventListener("resize",u)}),[u]),(0,a.useEffect)(()=>{if(n){const x=n.getBoundingClientRect();d(x)}},[n]),(0,e.jsx)("div",{className:"absolute top-0 h-full overflow-hidden bg-white transition-all duration-500",style:{right:`calc(100% - ${s?.right}px)`,height:m},children:(0,e.jsx)("div",{ref:r,className:"p-4",children:t?.map(x=>(0,e.jsx)("div",{className:"py-2",children:(0,e.jsx)(l.Link,{href:x.url,className:"text-sm font-bold leading-[1.4] no-underline",children:x.label})},x.id))})})},ne=({product:t,isCollection:n,position:r,seriesLabel:s})=>{const{buildProps:d,onSeriesProductClick:m}=(0,$.useNavContext)();let f=n?t:d?.products?.find(o=>o.handle===t.handle);const u=f?.variants?.find(o=>o.sku===t.sku)||f?.variants?.[0],x=(0,a.useMemo)(()=>`/products/${f?.handle}?variant=${(0,N.atobID)(u?.id)}`,[f?.handle,u?.id]),y=(0,a.useMemo)(()=>f?.tags?.filter?.(o=>o?.startsWith?.("CLtag"))?.map?.(o=>o?.replace?.("CLtag:",""))?.slice?.(0,2),[f?.tags]);return u?.availableForSale?(0,e.jsx)(l.Link,{href:x,onClick:o=>{o.preventDefault(),window.open(x,"_self"),m?.(f,r||0,s)},className:"no-underline hover:text-current",children:(0,e.jsxs)("div",{className:"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500",children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)(l.Picture,{source:`${u?.image?.url||t?.images?.[0]?.url}}`,width:90,height:90,className:"size-[96px]",imgClassName:"object-contain h-full"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:"flex gap-1",children:Array.isArray(y)&&y?.map((o,M)=>(0,e.jsx)(l.Text,{as:"p",html:o,className:"text-brand-0 mb-1 inline-block h-[24px] whitespace-nowrap rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]"},M))}),(0,e.jsx)(l.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:f?.title||t?.name}),t?.desc&&(0,e.jsx)(l.Text,{as:"p",html:t?.desc,className:"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]})}):null},le=({item:t,allPicture:n})=>(0,e.jsxs)(e.Fragment,{children:[t?.columns&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:t.label,as:"div",className:"my-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col",children:t.columns?.map(r=>(0,e.jsxs)("div",{className:"flex items-center gap-1 py-2",children:[(0,e.jsx)(l.Link,{href:`${r.url}?ref=navMenu`,asChild:!r.url,className:"text-sm font-bold leading-[1.4] no-underline",children:r.label}),r?.badge&&(0,e.jsx)(l.Text,{as:"p",html:r?.badge||"badge",className:"text-brand-0 h-[24px] rounded-full border-[1.6px] border-[var(--brand-color-0)] px-[6px] text-sm font-bold !leading-[22px]"})]},r.label))})]}),t?.imageUrl&&(0,e.jsx)("div",{className:(0,N.cn)("laptop:h-[280px] desktop:h-[224px] lg-desktop:h-[280px] tablet:max-w-[346px] laptop:max-w-[440px] desktop:w-full relative h-[240px] max-w-[358px] overflow-hidden",{"tablet:max-w-none laptop:max-w-none":n}),children:(0,e.jsxs)(l.Link,{href:`${t.url}?ref=navMenu`,asChild:!t.url,children:[(0,e.jsx)(l.Picture,{source:t.imageUrl,width:404,height:280,className:"size-full",imgClassName:"object-cover h-full hover:scale-105 transition-all duration-300"}),(0,e.jsxs)("div",{className:"absolute bottom-4 left-4 z-10 flex flex-col justify-end no-underline",children:[(0,e.jsx)(l.Text,{html:t.title,className:(0,N.cn)("lg-desktop:text-2xl text-xl font-bold leading-[1.2] text-white",{"text-black":t?.theme==="dark"})}),t.subtitle&&(0,e.jsx)(l.Text,{html:t.subtitle,className:(0,N.cn)("text-sm font-bold leading-[1.4] text-white",{"text-black":t?.theme==="dark"})}),t?.primary?.label&&(0,e.jsx)(l.Button,{as:"a",href:t?.primary?.url,variant:"link",size:"lg",className:(0,N.cn)("mr-auto !p-0 text-sm font-bold leading-[1.4] text-white",{"text-black":t?.theme==="dark"}),children:t?.primary?.label||"more"})]})]})})]}),re=(0,a.forwardRef)(({data:t,menuData:n,className:r,onPrimaryNavClick:s},d)=>{const m=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(t?.categories?.filter(w=>w?.mobileShow)),[t]),{currentMenu:f,setCurrentMenu:u,subSubCategory:x}=(0,$.useNavContext)(),[y,o]=(0,a.useState)(!1),[M,C]=(0,a.useState)(0),[p,k]=(0,a.useState)(null),v=(0,a.useRef)(null);(0,a.useEffect)(()=>{if(v?.current&&y){const w=v?.current?.getBoundingClientRect();C(window?.innerHeight-(w?.bottom||0))}},[y]),(0,J.useGSAP)(()=>{V.gsap.fromTo(v.current,{height:0},{height:M,duration:.3})},[M]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=y?"hidden":"auto"},[y]);const h=(0,a.useMemo)(()=>p?.components?.[0]?.blockType,[p]),c=(0,T.WithSupports)(Le,{categoriesItem:p}),b=(0,T.WithSidebar)(Me,p),D=(0,T.WithMulticol)(Pe,p),L=(0,a.useMemo)(()=>{switch(h){case g.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(b,{});case g.HeaderNavigationBlockType.Supports:return(0,e.jsx)(c,{});case g.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(D,{});default:return null}},[h,p,c]),P=(0,a.useCallback)(()=>{o(!1),C(0),u&&u(g.HeaderNavigationMenu.Primary)},[o,C,u]),S=(0,a.useMemo)(()=>t?.bar?.actions?.filter(w=>w?.mobileShow&&w?.blockType!==g.HeaderNavigationActionBlockType.Profile),[t]),B=(0,a.useMemo)(()=>t?.bar?.actions?.find(w=>w?.mobileShow&&w?.blockType===g.HeaderNavigationActionBlockType.Profile)||{},[t]),F=(0,a.useMemo)(()=>{switch(f){case g.HeaderNavigationMenu.Primary:return(0,e.jsx)(ze,{actions:S,menuOpen:y,onMenuOpenClose:()=>{o(!1),C(0)},onMenuOpenClick:()=>o(!0)});case g.HeaderNavigationMenu.Secondary:return(0,e.jsx)(ce,{title:p?.text,onMenuOpenClose:P,onMenuBackClick:()=>u?.(g.HeaderNavigationMenu.Primary)});case g.HeaderNavigationMenu.Third:return(0,e.jsx)(ce,{title:x?.label,onMenuOpenClose:P,onMenuBackClick:()=>u?.(g.HeaderNavigationMenu.Secondary)});default:return null}},[y,f,u,p,S,x,P]),j=(0,a.useCallback)((w,q)=>{const O=Array.isArray(m)?Array.isArray(m[w])?m[w][q]:{}:{};k(O),O?.components?.[0]?.blockType===g.HeaderNavigationBlockType.Links?O?.components?.[0]?.url&&window.open(O?.components?.[0]?.url):u?.(g.HeaderNavigationMenu.Secondary)},[m,u]);return(0,e.jsxs)(l.Container,{className:(0,N.cn)("relative h-[52px]",r),children:[F,y&&(0,e.jsxs)("nav",{ref:v,className:"absolute left-0 top-full z-[999] w-full overflow-y-auto border-t border-[#E4E5E6] bg-white text-black",style:{height:M},role:"navigation","aria-label":"Mobile navigation menu",children:[f===g.HeaderNavigationMenu.Primary?(0,e.jsx)("div",{className:"pt-4",children:(0,e.jsx)(l.BrandStrip,{data:n})}):null,f===g.HeaderNavigationMenu.Primary?(0,e.jsx)(De,{categories:m,onPrimaryMenuClick:j,onPrimaryNavClick:s,profileAction:B}):L]})]})}),De=({categories:t,onPrimaryMenuClick:n,profileAction:r,onPrimaryNavClick:s})=>(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:t?.map((d,m)=>(0,e.jsxs)("div",{className:"",children:[(0,e.jsx)("div",{className:(0,N.cn)("my-2 h-px w-full bg-[#E5E5E7]")}),d?.map((f,u)=>(0,e.jsx)(K,{label:f.text,onClick:()=>{const y=(t?.flat()||[])?.findIndex(o=>o?.id===t[m][u]?.id);n(m,u),s?.(f,y)},icon:f.components?.[0]?.icon},f.id))]},`groupCategory-${m}`))}),(0,e.jsx)(Ee,{profileAction:r})]}),Me=({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{currentMenu:r,setCurrentMenu:s,subSubCategory:d,setSubSubCategory:m,setCurrentSeriesMetadata:f,currentSeriesMetadata:u,buildProps:x,onSidebarNavClick:y}=(0,$.useNavContext)(),[o,M]=(0,a.useState)([]),[C,p]=(0,a.useState)([]);(0,a.useEffect)(()=>{t?.subcategories?.length&&M(t?.subcategories?.map((c,b)=>({index:b,open:!1})))},[t]),(0,a.useEffect)(()=>{d?.subSubCategories?.length&&p(d?.subSubCategories?.map((c,b)=>({index:b,open:b===0})))},[d]);const k=(0,a.useCallback)((c,b)=>{s&&s(g.HeaderNavigationMenu.Third),m?.(c);const D=n?.find(L=>b!==void 0?c?.subSubCategories?.[b]?.label?.toLowerCase()===L.label?.toLowerCase():c?.label?.toLowerCase()===L.label?.toLowerCase())||{};if(c?.collections){const L=x?.categories?.[c?.collections]||{};f?.({label:D?.label,isCollection:!0,banner:D?.banner,primary:D?.primary,series:[{products:L?.products}]})}else f?.(D)},[n,s,m,f,x?.categories]),v=(0,a.useMemo)(()=>n?.find(c=>!!c?.guide)?.guide,[n]);return(0,a.useMemo)(()=>{switch(r){case g.HeaderNavigationMenu.Secondary:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 tablet:justify-start tablet:gap-16 flex h-full flex-col justify-between p-4",children:[(0,e.jsx)("div",{children:t?.subcategories?.map((c,b)=>(0,e.jsx)("div",{children:(0,e.jsx)(K,{label:c?.label,active:o.find(D=>D.index===b)?.open,onClick:()=>{k(c),y?.(c,b)}})},`${c.label}-${b}`))}),(0,e.jsxs)("div",{className:"tablet:items-start flex flex-col items-center gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"tablet:w-auto w-full text-base",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"tablet:w-auto tablet:px-0 w-full py-0 text-base",children:t?.secondary?.label})]})]});case g.HeaderNavigationMenu.Third:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:[d?.subSubCategories?d?.subSubCategories?.map((c,b)=>{const D=n?.find(P=>P.label.toLowerCase()===c?.label?.toLowerCase())||{};let L={};if(c?.collections){const P=x?.categories?.[c?.collections]||{};L={label:D?.label,isCollection:!0,banner:D?.banner,primary:D?.primary,series:[{products:P?.products}]}}else L=D;return(0,e.jsxs)("div",{children:[Reflect.ownKeys(c).length>0&&(0,e.jsx)(oe,{matchSeriesMetadata:L,onSubSubCategoryItemClick:()=>{y?.(c,b),p(P=>P.map((S,B)=>({...S,open:B===b?!S.open:S.open})))},expanded:!!C?.find(P=>P.index===b)?.open}),C?.find(P=>P.index===b)?.open&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(ie,{matchSeriesMetadata:L}),L?.primary&&(0,e.jsx)("div",{className:"my-4 text-center",children:(0,e.jsx)(l.Button,{as:"a",href:L?.primary?.url,className:"text-base leading-[1.2] no-underline",variant:"secondary",size:"base",children:L?.primary?.label})})]})]},`${c.label}-${b}`)}):(0,e.jsxs)(e.Fragment,{children:[Reflect.ownKeys(u).length>0&&(0,e.jsx)(oe,{matchSeriesMetadata:u}),(0,e.jsx)(ie,{matchSeriesMetadata:u}),u?.primary&&(0,e.jsx)("div",{className:"my-4 text-center ",children:(0,e.jsx)(l.Button,{as:"a",href:`${u?.primary?.url}?ref=${u?.label}_viewmore`,variant:"secondary",size:"base",className:"text-base leading-[1.2] no-underline",children:u?.primary?.label})})]}),v&&(0,e.jsx)(l.Link,{href:v?.url,children:(0,e.jsx)("div",{className:"mt-4",children:(0,e.jsx)(l.Text,{html:v?.label,className:"text-sm font-bold leading-[1.2] text-[#6D6D6F]"})})})]});default:return null}},[r,t,n,o,C,d,u,x?.categories,v,k,y])},oe=({matchSeriesMetadata:t,onSubSubCategoryItemClick:n,expanded:r})=>{const s=(0,e.jsxs)(e.Fragment,{children:[t?.label&&(0,e.jsx)(l.Text,{html:t?.label,className:"text-sm font-bold leading-[1.4]"}),n&&(0,e.jsx)(z.DownArrow,{"aria-hidden":"true",className:(0,N.cn)("size-5",{"rotate-180":r})})]});return n?(0,e.jsx)("button",{className:"tablet:pt-0 flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left",onClick:n,"aria-expanded":r,children:s}):(0,e.jsx)("div",{className:"tablet:pt-0 flex items-center justify-between py-4",children:s})},ie=({matchSeriesMetadata:t})=>(0,e.jsx)("div",{className:"laptop:gap-3 flex flex-col gap-2",children:!!t?.series?.length&&t?.series?.map((n,r)=>(0,e.jsxs)("div",{children:[n.label&&(0,e.jsx)(l.Text,{html:n.label,className:"mb-2 text-sm font-bold leading-[1.4] text-[#3D3D3F]"}),(0,e.jsxs)("div",{className:"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2",children:[!!t?.banner&&(0,e.jsx)(l.Link,{asChild:!t?.banner?.href,href:t?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[(0,e.jsx)(l.Picture,{source:t?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:t?.banner?.title||"Buy in Guide",className:(0,N.cn)("font-bold text-white",{"text-black":t?.banner?.theme==="dark"})}),(0,e.jsx)(l.Text,{html:t?.banner?.desc||"20.000mAh",className:(0,N.cn)("text-sm font-bold text-white",{"text-black":t?.banner?.theme==="dark"})})]})]})}),n.products?.map((s,d)=>(0,e.jsx)(ne,{position:d,product:s,seriesLabel:t?.label,isCollection:t?.isCollection},`seriesProductItem-${r}-${d}`))]})]},`seriesItem-${r}`))}),Le=({supportsMetadata:t})=>(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:t?.map(n=>(0,e.jsx)(K,{href:n.url,label:n.label,onClick:()=>{}},n.id))}),Pe=({multicolMetadata:t})=>{const n=(0,a.useMemo)(()=>!t?.some(r=>!!r.columns),[t]);return(0,e.jsx)("div",{className:(0,N.cn)("tablet:py-4 tablet:px-8 laptop:px-16 tablet:gap-6 flex flex-col gap-4 p-4",{"tablet:grid tablet:grid-cols-2 tablet:gap-3 laptop:gap-4":n}),children:t?.map((r,s)=>(0,e.jsx)("div",{children:(0,e.jsx)(le,{item:r,allPicture:n})},`multicolItem-${r?.label}-${s}`))})},Ee=({profileAction:t})=>{const[n,r]=(0,a.useState)(!1),{profile:s,event:d}=(0,$.useNavContext)();return(0,e.jsxs)("div",{className:(0,N.cn)("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":n}),children:[(0,e.jsxs)("button",{className:"flex w-full cursor-pointer items-center justify-between border-0 bg-transparent",onClick:()=>r(!n),"aria-expanded":n,"aria-label":s?.nick_name||t?.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)(z.User,{"aria-hidden":"true"})}),(0,e.jsx)(l.Text,{html:s?.nick_name||t?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!s?.email&&(0,e.jsx)(z.DownArrow,{"aria-hidden":"true",className:(0,N.cn)("laptop:size-4 size-5",{"rotate-180":n})})]}),s?.email&&(0,e.jsx)("nav",{className:"mt-4",role:"navigation","aria-label":"Profile menu",children:t?.profiles?.map(m=>(0,e.jsx)(K,{label:m?.title,href:m?.url},m.id))}),n&&!s?.email&&(0,e.jsxs)("div",{className:"mt-4",children:[(0,e.jsx)(l.Text,{html:t?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:t?.benefits?.map(m=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:m.benefitIcon?.url,className:"size-4",alt:m.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:m.benefit,className:"text-sm font-bold leading-[1.4]"})]},m.id))})]}),!s?.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:()=>d?.join?.(),children:(0,e.jsx)(l.Text,{html:t?.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:()=>d?.login?.(),children:(0,e.jsx)(l.Text,{html:t?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},ze=({menuOpen:t,onMenuOpenClose:n,onMenuOpenClick:r,actions:s})=>(0,e.jsxs)("div",{className:"flex h-full items-center justify-between gap-4",children:[(0,e.jsx)(se,{}),(0,e.jsxs)("div",{className:"desktop:gap-6 flex items-center gap-4",children:[(0,e.jsx)(Y,{actions:s}),t?(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>n(),"aria-label":"Close menu","aria-expanded":"true",children:(0,e.jsx)(z.Close,{className:"size-5","aria-hidden":"true"})}):(0,e.jsx)("button",{className:"cursor-pointer border-0 bg-transparent p-0",onClick:()=>r(),"aria-label":"Open menu","aria-expanded":"false","aria-haspopup":"true",children:(0,e.jsx)(z.Menu,{className:"size-5","aria-hidden":"true"})})]})]}),se=()=>{const{payloadData:t,isMobile:n}=(0,$.useNavContext)();return(0,e.jsx)("a",{href:"/",className:"hover:text-brand-0 [&>svg]:w-full","aria-label":"Home",dangerouslySetInnerHTML:{__html:n?t?.bar?.mobileLogo:t?.bar?.desktopLogo}})},Y=(0,a.forwardRef)(({actions:t,activeStatus:n=!1},r)=>{const{event:s,cartCount:d}=(0,$.useNavContext)(),[m,f]=(0,a.useState)(null),u=y=>{switch(y){case g.HeaderNavigationActionBlockType.Search:return"Search";case g.HeaderNavigationActionBlockType.Cart:return`Shopping cart${d>0?` (${d} items)`:""}`;case g.HeaderNavigationActionBlockType.Profile:return"User profile";case g.HeaderNavigationActionBlockType.Livestream:return"Livestream";default:return"Action"}},x=(0,a.useCallback)((y,o)=>{switch(f(o),y?.blockType){case g.HeaderNavigationActionBlockType.Search:s?.search?.();break;case g.HeaderNavigationActionBlockType.Cart:s?.cart?.();break;case g.HeaderNavigationActionBlockType.Profile:s?.profile?.();break;case g.HeaderNavigationActionBlockType.Livestream:s?.livestream?.();break;default:return()=>{}}},[s]);return(0,e.jsx)("div",{className:"desktop:gap-6 flex items-center gap-4",children:Array.isArray(t)&&t?.map((y,o)=>(0,e.jsxs)("button",{className:"relative cursor-pointer border-0 bg-transparent p-0",ref:y.blockType===g.HeaderNavigationActionBlockType.Profile?r:null,onClick:()=>x(y,o),"aria-label":u(y.blockType),"aria-pressed":n&&m===o,children:[(0,e.jsx)(l.Text,{html:y.icon,className:(0,N.cn)("size-5",{"text-brand-0":n&&m===o}),"aria-hidden":"true"}),y.blockType===g.HeaderNavigationActionBlockType.Cart&&d>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:d?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},y.id))})}),ce=({title:t,onMenuOpenClose:n,onMenuBackClick:r})=>(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:()=>r(),"aria-label":"Back to previous menu",children:(0,e.jsx)(z.LeftArrow,{className:"size-5","aria-hidden":"true"})}),(0,e.jsx)(l.Text,{html:t,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:()=>n(),"aria-label":"Close menu",children:(0,e.jsx)(z.Close,{className:"size-5","aria-hidden":"true"})})]}),K=({label:t,href:n,onClick:r,active:s,icon:d,className:m})=>{const f=(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(l.Text,{html:t,className:(0,N.cn)("text-sm font-bold leading-[1.4]",{underline:d})}),d&&(0,e.jsx)(l.Text,{html:d,"aria-hidden":"true"})]}),(0,e.jsx)(z.RightArrow,{className:(0,N.cn)("laptop:size-4 size-5",{"rotate-90":s}),"aria-hidden":"true"})]});return n?(0,e.jsx)(l.Link,{href:n,className:(0,N.cn)("flex cursor-pointer items-center justify-between py-4 no-underline",m),children:f}):(0,e.jsx)("button",{className:(0,N.cn)("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left",m),onClick:r,"aria-expanded":s,children:f})};re.displayName="MobileNavigation",Y.displayName="Actions",ee.displayName="HeaderNavigation",te.displayName="DesktopNavigation",ae.displayName="SidebarDropdown";var He=(0,de.withLayout)(ee);
 //# sourceMappingURL=index.js.map