@anker-in/headless-ui 1.1.28 → 1.1.29

package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/HeaderNavigation/SidebarDropdown.tsx"],
+  "sourcesContent": ["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { Button, Container, Text, Link, Heading, Picture } from '../../components/index.js'\nimport { cn, atobID } from '../../helpers/utils.js'\nimport { DownArrow } from './icons/index.js'\nimport { useNavContext } from './NavProvider.js'\nimport type { Product, ProductVariant } from '../../cpn-components/CpnProductCard/types.js'\n\n/**\n * \u4FA7\u8FB9\u680F\u4E0B\u62C9\n * @param categoriesItem \u5206\u7C7B\u9879\n */\nexport const SidebarDropdown = React.memo(\n  ({ sidebarCategoriesMetadata, seriesMetadata }: { sidebarCategoriesMetadata: any; seriesMetadata: any }) => {\n    const { buildProps, onSidebarNavClick } = useNavContext()\n    const [expandedSubcategory, setExpandedSubcategory] = useState<{ index: number; open: boolean }[]>([])\n    const [activeSubSubcategoryIndex, setActiveSubSubcategoryIndex] = useState(-1)\n    const sidebarDropdownRef = useRef<HTMLDivElement>(null)\n\n    const initExpandedSubcategory = useCallback(() => {\n      const subcategories = sidebarCategoriesMetadata?.subcategories\n      if (!subcategories?.length) return\n\n      const withSubSubCategoriesIndex = subcategories.findIndex((item: any) => !!item?.subSubCategories)\n      const withoutSubSubCategoriesIndex = subcategories.findIndex((item: any) => !item?.subSubCategories)\n\n      // \u521B\u5EFA\u5C55\u5F00\u72B6\u6001\u6570\u7EC4\n      const expandedStates = subcategories.map((_: any, index: number) => ({\n        index,\n        open: withSubSubCategoriesIndex === index || withoutSubSubCategoriesIndex === index,\n      }))\n\n      setExpandedSubcategory(expandedStates)\n    }, [sidebarCategoriesMetadata])\n\n    useEffect(() => {\n      initExpandedSubcategory()\n    }, [initExpandedSubcategory])\n\n    // \u901A\u8FC7categoriesMetadata\u7684subSubCategories\u7684label\u4E0Eseries\u7684label\u5339\u914D\n    const matchSeriesMetadata = useMemo(() => {\n      const subCategory =\n        sidebarCategoriesMetadata?.subcategories?.[expandedSubcategory?.find(item => item.open)?.index || 0]\n      const currentSeriesMetadata =\n        seriesMetadata?.find((item: any) => item?.label?.toLowerCase() === subCategory?.label?.toLowerCase()) || {}\n      if (subCategory?.collections) {\n        const category = buildProps?.categories?.[subCategory?.collections] || {}\n        return {\n          label: currentSeriesMetadata?.label,\n          isCollection: true,\n          banner: currentSeriesMetadata?.banner,\n          primary: currentSeriesMetadata?.primary,\n          guide: currentSeriesMetadata?.guide,\n          series: [\n            {\n              products: category?.products,\n            },\n          ],\n        }\n      } else {\n        if (subCategory?.subSubCategories) {\n          const activeSubSubcategory = subCategory?.subSubCategories?.[activeSubSubcategoryIndex]\n          const currentActiveSeriesMetadata =\n            seriesMetadata?.find(\n              (item: any) => item?.label?.toLowerCase() === activeSubSubcategory?.label?.toLowerCase()\n            ) || {}\n          if (activeSubSubcategory?.collections) {\n            const category = buildProps?.categories?.[activeSubSubcategory?.collections] || {}\n            return {\n              label: currentActiveSeriesMetadata?.label,\n              isCollection: true,\n              banner: currentActiveSeriesMetadata?.banner,\n              primary: currentActiveSeriesMetadata?.primary,\n              guide: currentActiveSeriesMetadata?.guide,\n              series: [\n                {\n                  products: category?.products,\n                },\n              ],\n            }\n          } else {\n            return currentActiveSeriesMetadata\n          }\n        } else {\n          return currentSeriesMetadata\n        }\n      }\n    }, [sidebarCategoriesMetadata, expandedSubcategory, activeSubSubcategoryIndex, seriesMetadata, buildProps])\n\n    const handleSubcategoryOpen = useCallback((index: number, subcategoryItem: any) => {\n      subcategoryItem?.subSubCategories?.length > 0 ? setActiveSubSubcategoryIndex(0) : setActiveSubSubcategoryIndex(-1)\n\n      setExpandedSubcategory(prev => prev.map((item, i) => ({ ...item, open: i === index ? !item.open : false })))\n    }, [])\n\n    const handleSubSubcategoryOpen = (index: number, subSubindex: number) => {\n      setExpandedSubcategory(prev =>\n        prev.map(item => (item.index === index ? { ...item, open: true } : { ...item, open: false }))\n      )\n      setActiveSubSubcategoryIndex(subSubindex)\n    }\n\n    return (\n      <Container childClassName=\"lg-desktop:gap-12 flex bg-white gap-8\">\n        <div\n          className=\"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4\"\n          style={{\n            userSelect: 'none',\n          }}\n          ref={sidebarDropdownRef}\n        >\n          <div\n            className=\"desktop:h-[416px] flex flex-col overflow-y-auto\"\n            style={{\n              scrollbarWidth: 'none',\n              msOverflowStyle: 'none',\n            }}\n          >\n            {sidebarCategoriesMetadata?.subcategories?.map((subItem: any, index: number) => {\n              const hasSubSubCategory =\n                Array.isArray(subItem?.subSubCategories) && subItem?.subSubCategories?.length > 0\n              const isExpanded = expandedSubcategory?.find(item => item.index === index)?.open\n              return (\n                <div key={`subcategoryItem-${index}`}>\n                  <button\n                    className={cn(\n                      'flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left',\n                      {\n                        'bg-[#F5F5F7]': !hasSubSubCategory && isExpanded,\n                      }\n                    )}\n                    onClick={() => {\n                      handleSubcategoryOpen(index, subItem)\n                      onSidebarNavClick?.(subItem, index)\n                    }}\n                    aria-expanded={hasSubSubCategory ? isExpanded : undefined}\n                    aria-haspopup={hasSubSubCategory ? 'true' : undefined}\n                  >\n                    <Text html={subItem.label} className=\"p-4 text-sm font-bold leading-[1.4]\" />\n                    {hasSubSubCategory && (\n                      <DownArrow\n                        aria-hidden=\"true\"\n                        className={cn('size-4', {\n                          ['rotate-180']: isExpanded,\n                        })}\n                      />\n                    )}\n                  </button>\n                  {isExpanded && (\n                    <div className=\"flex flex-col\" role=\"menu\">\n                      {subItem.subSubCategories?.map((subSubItem: any, subSubindex: number) => (\n                        <button\n                          onClick={() => {\n                            handleSubSubcategoryOpen(index, subSubindex)\n                            onSidebarNavClick?.(subSubItem, subSubindex)\n                          }}\n                          key={`subSubItem-${index}-${subSubindex}`}\n                          className={cn(\n                            'w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]',\n                            {\n                              'bg-[#F5F5F7]': activeSubSubcategoryIndex === subSubindex,\n                            }\n                          )}\n                          role=\"menuitem\"\n                          aria-label={subSubItem.label}\n                        >\n                          <Text html={subSubItem.label} className=\"text-sm font-bold leading-[1.4] text-[#4A4C56]\" />\n                        </button>\n                      ))}\n                    </div>\n                  )}\n                </div>\n              )\n            })}\n          </div>\n          {sidebarCategoriesMetadata && (\n            <div className=\"flex\">\n              <div className=\"flex flex-col gap-4\">\n                {sidebarCategoriesMetadata?.primary && (\n                  <Button\n                    as=\"a\"\n                    href={`${sidebarCategoriesMetadata?.primary?.url}?ref=${sidebarCategoriesMetadata?.primary?.label}_shopall`}\n                    variant=\"primary\"\n                    size=\"lg\"\n                    className=\"lg-desktop:text-base text-sm\"\n                  >\n                    {sidebarCategoriesMetadata?.primary?.label}\n                  </Button>\n                )}\n                {sidebarCategoriesMetadata?.secondary && (\n                  <Button\n                    as=\"a\"\n                    href={sidebarCategoriesMetadata?.secondary?.url}\n                    variant=\"link\"\n                    size=\"lg\"\n                    iconClassName=\"size-4\"\n                    className=\"lg-desktop:text-base justify-start !p-0 text-sm\"\n                  >\n                    {sidebarCategoriesMetadata?.secondary?.label}\n                  </Button>\n                )}\n              </div>\n            </div>\n          )}\n        </div>\n        <div className=\"flex-1 py-4\">\n          {Reflect.ownKeys(matchSeriesMetadata).length > 0 && (\n            <div className=\"mb-4 flex items-center justify-between\">\n              <div className=\"flex items-center gap-2\">\n                <Text\n                  html={matchSeriesMetadata?.label}\n                  className=\"lg-desktop:text-2xl text-xl font-bold leading-[1.4]\"\n                />\n                {matchSeriesMetadata?.primary && !matchSeriesMetadata?.primary?.hide && (\n                  <Button\n                    as=\"a\"\n                    href={`${matchSeriesMetadata?.primary?.url}?ref=${matchSeriesMetadata?.label}_viewmore`}\n                    variant=\"link\"\n                    size=\"lg\"\n                    iconClassName=\"size-4\"\n                    className=\"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline\"\n                  >\n                    {matchSeriesMetadata?.primary?.label}\n                  </Button>\n                )}\n              </div>\n              <Link\n                href={matchSeriesMetadata?.guide?.url}\n                className=\"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]\"\n              >\n                {matchSeriesMetadata?.guide?.label}\n              </Link>\n            </div>\n          )}\n          <div\n            className=\"flex h-[426px] flex-col gap-4 overflow-y-auto\"\n            style={{\n              scrollbarWidth: 'none',\n              msOverflowStyle: 'none',\n            }}\n          >\n            {matchSeriesMetadata?.series?.map((seriesItem: any, seriesIndex: number) => (\n              <div key={`seriesItem-${seriesIndex}`}>\n                {seriesItem.label && (\n                  <Text\n                    html={seriesItem.label}\n                    as=\"p\"\n                    className=\"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]\"\n                  />\n                )}\n                <div className=\"grid grid-cols-3 gap-4\">\n                  {!!matchSeriesMetadata?.banner && (\n                    <Link asChild={!matchSeriesMetadata?.banner?.href} href={matchSeriesMetadata?.banner?.href}>\n                      <div className=\"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n                        <Picture\n                          source={matchSeriesMetadata?.banner?.imageUrl}\n                          className=\"laptop:h-[120px] h-[114px]\"\n                          imgClassName=\"object-cover h-full\"\n                        />\n                        <div className=\"absolute inset-x-0 bottom-0 p-4\">\n                          <Heading\n                            size={2}\n                            html={matchSeriesMetadata?.banner?.title || 'Buy in Guide'}\n                            className={cn('font-bold text-white', {\n                              'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n                            })}\n                          />\n                          <Text\n                            html={matchSeriesMetadata?.banner?.desc || '20.000mAh'}\n                            className={cn('text-sm font-bold text-white', {\n                              'text-black': matchSeriesMetadata?.banner?.theme === 'dark',\n                            })}\n                          />\n                        </div>\n                      </div>\n                    </Link>\n                  )}\n                  {seriesItem.products?.map((product: any, index: number) => (\n                    <SeriesProductItem\n                      seriesLabel={matchSeriesMetadata?.label}\n                      key={`seriesProductItem-${index}`}\n                      product={product}\n                      isCollection={matchSeriesMetadata?.isCollection}\n                    />\n                  ))}\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </Container>\n    )\n  }\n)\n\nSidebarDropdown.displayName = 'SidebarDropdown'\n\n/**\n * \u7CFB\u5217\u4EA7\u54C1\u9879\u7EC4\u4EF6\n */\nexport const SeriesProductItem = ({\n  product,\n  isCollection,\n  position,\n  seriesLabel,\n}: {\n  product: any\n  isCollection?: boolean\n  position?: number\n  seriesLabel?: string\n}) => {\n  const { buildProps, onSeriesProductClick } = useNavContext()\n  let productData = isCollection\n    ? product\n    : buildProps?.products?.find((item: Product) => item.handle === product.handle)\n  const variant =\n    productData?.variants?.find((item: ProductVariant) => item.sku === product.sku) || productData?.variants?.[0]\n\n  const listingLink = useMemo(() => {\n    return `/products/${productData?.handle}?variant=${atobID(variant?.id as string)}`\n  }, [productData?.handle, variant?.id])\n\n  const tags = useMemo(() => {\n    return productData?.tags\n      ?.filter?.((item: any) => item?.startsWith?.('CLtag'))\n      ?.map?.((item: any) => item?.replace?.('CLtag:', ''))\n      ?.slice?.(0, 2)\n  }, [productData?.tags])\n\n  if (!variant?.availableForSale) return null\n\n  return (\n    <Link\n      href={listingLink}\n      onClick={e => {\n        e.preventDefault()\n        window.open(listingLink, '_self')\n        onSeriesProductClick?.(productData, position || 0, seriesLabel)\n      }}\n      className=\"no-underline hover:text-current\"\n    >\n      <div className=\"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500\">\n        <div className=\"shrink-0\">\n          <img\n            src={`${variant?.image?.url || product?.images?.[0]?.url}`}\n            loading=\"lazy\"\n            alt={productData?.title || product?.name}\n            width={90}\n            height={90}\n            className=\"size-[96px] object-contain\"\n          />\n        </div>\n        <div className=\"relative\">\n          <div className=\"flex gap-1\">\n            {Array.isArray(tags) &&\n              tags?.map((tag: string, index: number) => (\n                <Text\n                  key={index}\n                  as=\"p\"\n                  html={tag}\n                  className=\"text-brand-0 mb-1 inline-block h-[24px] whitespace-nowrap rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-xs font-bold !leading-[22px]\"\n                />\n              ))}\n          </div>\n          <Text\n            className=\"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]\"\n            html={productData?.title || product?.name}\n          />\n          {product?.desc && (\n            <Text\n              as=\"p\"\n              html={product?.desc}\n              className=\"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n            />\n          )}\n        </div>\n      </div>\n    </Link>\n  )\n}\n"],
+  "mappings": "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",
+  "names": ["SidebarDropdown_exports", "__export", "SeriesProductItem", "SidebarDropdown", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_icons", "import_NavProvider", "React", "sidebarCategoriesMetadata", "seriesMetadata", "buildProps", "onSidebarNavClick", "expandedSubcategory", "setExpandedSubcategory", "activeSubSubcategoryIndex", "setActiveSubSubcategoryIndex", "sidebarDropdownRef", "initExpandedSubcategory", "subcategories", "withSubSubCategoriesIndex", "item", "withoutSubSubCategoriesIndex", "expandedStates", "_", "index", "matchSeriesMetadata", "subCategory", "currentSeriesMetadata", "category", "activeSubSubcategory", "currentActiveSeriesMetadata", "handleSubcategoryOpen", "subcategoryItem", "prev", "i", "handleSubSubcategoryOpen", "subSubindex", "subItem", "hasSubSubCategory", "isExpanded", "subSubItem", "seriesItem", "seriesIndex", "product", "isCollection", "position", "seriesLabel", "onSeriesProductClick", "productData", "variant", "listingLink", "tags", "e", "tag"]
+}

package/dist/cjs/biz-components/HeaderNavigation/SupportsDropdown.d.ts

@@ -0,0 +1,9 @@
+/**
+ * supports下拉
+ * @param categoriesItem 分类项
+ * @param currentNavItemRef 当前导航项
+ */
+export declare const SupportsDropdown: ({ supportsMetadata, currentNavItemRef, }: {
+    supportsMetadata: any;
+    currentNavItemRef: HTMLDivElement;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+"use strict";var a=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var v=(t,e)=>{for(var n in e)a(t,n,{get:e[n],enumerable:!0})},w=(t,e,n,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of h(e))!m.call(t,s)&&s!==n&&a(t,s,{get:()=>e[s],enumerable:!(l=f(e,s))||l.enumerable});return t};var D=t=>w(a({},"__esModule",{value:!0}),t);var b={};v(b,{SupportsDropdown:()=>R});module.exports=D(b);var r=require("react/jsx-runtime"),i=require("react"),c=require("../../components/index.js"),p=require("es-toolkit");const R=({supportsMetadata:t,currentNavItemRef:e})=>{const n=(0,i.useRef)(null),[l,s]=(0,i.useState)(null),[u,g]=(0,i.useState)(0);(0,i.useEffect)(()=>{if(n?.current){const o=n?.current?.getBoundingClientRect();g(o.height)}},[n]);const d=(0,p.debounce)(()=>{if(e){const o=e.getBoundingClientRect();s(o)}},500);return(0,i.useEffect)(()=>(d(),window.addEventListener("resize",d),()=>{window.removeEventListener("resize",d)}),[d]),(0,i.useEffect)(()=>{if(e){const o=e.getBoundingClientRect();s(o)}},[e]),(0,r.jsx)("div",{className:"absolute top-0 h-full overflow-hidden bg-white transition-all duration-500",style:{right:`calc(100% - ${l?.right}px)`,height:u},children:(0,r.jsx)("div",{ref:n,className:"p-4",children:t?.map(o=>(0,r.jsx)("div",{className:"py-2",children:(0,r.jsx)(c.Link,{href:o.url,className:"text-sm font-bold leading-[1.4] no-underline",children:o.label})},o.id))})})};
+//# sourceMappingURL=SupportsDropdown.js.map

package/dist/cjs/biz-components/HeaderNavigation/SupportsDropdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/HeaderNavigation/SupportsDropdown.tsx"],
+  "sourcesContent": ["import React, { useEffect, useRef, useState } from 'react'\nimport { Link } from '../../components/index.js'\nimport { debounce } from 'es-toolkit'\n\n/**\n * supports\u4E0B\u62C9\n * @param categoriesItem \u5206\u7C7B\u9879\n * @param currentNavItemRef \u5F53\u524D\u5BFC\u822A\u9879\n */\nexport const SupportsDropdown = ({\n  supportsMetadata,\n  currentNavItemRef,\n}: {\n  supportsMetadata: any\n  currentNavItemRef: HTMLDivElement\n}) => {\n  const supportsDropdownRef = useRef<HTMLDivElement>(null)\n  const [navItemReact, setNavItemReact] = useState<DOMRect | null>(null)\n  const [supportsDropdownHeight, setSupportsDropdownHeight] = useState(0)\n\n  useEffect(() => {\n    if (supportsDropdownRef?.current) {\n      const rect = supportsDropdownRef?.current?.getBoundingClientRect()\n      setSupportsDropdownHeight(rect.height)\n    }\n  }, [supportsDropdownRef])\n\n  const debouncedHandleResize = debounce(() => {\n    if (currentNavItemRef) {\n      const rect = currentNavItemRef.getBoundingClientRect()\n      setNavItemReact(rect)\n    }\n  }, 500)\n\n  useEffect(() => {\n    debouncedHandleResize()\n    window.addEventListener('resize', debouncedHandleResize)\n    return () => {\n      window.removeEventListener('resize', debouncedHandleResize)\n    }\n  }, [debouncedHandleResize])\n\n  useEffect(() => {\n    if (currentNavItemRef) {\n      const rect = currentNavItemRef.getBoundingClientRect()\n      setNavItemReact(rect)\n    }\n  }, [currentNavItemRef])\n\n  return (\n    <div\n      className=\"absolute top-0 h-full overflow-hidden bg-white transition-all duration-500\"\n      style={{ right: `calc(100% - ${navItemReact?.right}px)`, height: supportsDropdownHeight }}\n    >\n      <div ref={supportsDropdownRef} className=\"p-4\">\n        {supportsMetadata?.map((supportItem: any) => (\n          <div key={supportItem.id} className=\"py-2\">\n            <Link href={supportItem.url} className=\"text-sm font-bold leading-[1.4] no-underline\">\n              {supportItem.label}\n            </Link>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,sBAAAE,IAAA,eAAAC,EAAAH,GAyDY,IAAAI,EAAA,6BAzDZC,EAAmD,iBACnDC,EAAqB,qCACrBC,EAAyB,sBAOlB,MAAML,EAAmB,CAAC,CAC/B,iBAAAM,EACA,kBAAAC,CACF,IAGM,CACJ,MAAMC,KAAsB,UAAuB,IAAI,EACjD,CAACC,EAAcC,CAAe,KAAI,YAAyB,IAAI,EAC/D,CAACC,EAAwBC,CAAyB,KAAI,YAAS,CAAC,KAEtE,aAAU,IAAM,CACd,GAAIJ,GAAqB,QAAS,CAChC,MAAMK,EAAOL,GAAqB,SAAS,sBAAsB,EACjEI,EAA0BC,EAAK,MAAM,CACvC,CACF,EAAG,CAACL,CAAmB,CAAC,EAExB,MAAMM,KAAwB,YAAS,IAAM,CAC3C,GAAIP,EAAmB,CACrB,MAAMM,EAAON,EAAkB,sBAAsB,EACrDG,EAAgBG,CAAI,CACtB,CACF,EAAG,GAAG,EAEN,sBAAU,KACRC,EAAsB,EACtB,OAAO,iBAAiB,SAAUA,CAAqB,EAChD,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAqB,CAC5D,GACC,CAACA,CAAqB,CAAC,KAE1B,aAAU,IAAM,CACd,GAAIP,EAAmB,CACrB,MAAMM,EAAON,EAAkB,sBAAsB,EACrDG,EAAgBG,CAAI,CACtB,CACF,EAAG,CAACN,CAAiB,CAAC,KAGpB,OAAC,OACC,UAAU,6EACV,MAAO,CAAE,MAAO,eAAeE,GAAc,KAAK,MAAO,OAAQE,CAAuB,EAExF,mBAAC,OAAI,IAAKH,EAAqB,UAAU,MACtC,SAAAF,GAAkB,IAAKS,MACtB,OAAC,OAAyB,UAAU,OAClC,mBAAC,QAAK,KAAMA,EAAY,IAAK,UAAU,+CACpC,SAAAA,EAAY,MACf,GAHQA,EAAY,EAItB,CACD,EACH,EACF,CAEJ",
+  "names": ["SupportsDropdown_exports", "__export", "SupportsDropdown", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_es_toolkit", "supportsMetadata", "currentNavItemRef", "supportsDropdownRef", "navItemReact", "setNavItemReact", "supportsDropdownHeight", "setSupportsDropdownHeight", "rect", "debouncedHandleResize", "supportItem"]
+}

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

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