@anker-in/headless-ui 1.1.28 → 1.1.29

package/dist/esm/biz-components/HeaderNavigation/NavProvider.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/HeaderNavigation/NavProvider.tsx"],
-  "sourcesContent": ["import React, { createContext, useCallback, useContext, useMemo, useReducer } from 'react'\nimport type { Product } from '../../cpn-components/CpnProductCard/types.js'\nimport { HeaderNavigationMenu } from './types.js'\nimport type { UserProfile } from './types.js'\n\ninterface NavContextType {\n  buildProps: {\n    products?: Product[] // \u4EA7\u54C1\u6570\u636E\n    categories?: Record<string, any> // \u5206\u7C7B\u6570\u636E\n  }\n  cartCount: number\n  event?: {\n    search?: () => void\n    cart?: () => void\n    profile?: () => void\n    livestream?: () => void\n    join?: () => void\n    login?: () => void\n  }\n  profile?: UserProfile // \u7528\u6237\u4FE1\u606F\n  isMobile?: boolean\n  payloadData: any\n  currentMenu?: HeaderNavigationMenu // \u5F53\u524D\u83DC\u5355\n  setCurrentMenu?: (_menu: HeaderNavigationMenu) => void // \u8BBE\u7F6E\u5F53\u524D\u83DC\u5355\n  currentSeriesMetadata?: any // \u5F53\u524D\u7CFB\u5217\u5143\u6570\u636E\n  setCurrentSeriesMetadata?: (_metadata: any) => void // \u8BBE\u7F6E\u5F53\u524D\u7CFB\u5217\u5143\u6570\u636E\n  subSubCategory?: any // \u5B50\u5B50\u5206\u7C7B\n  setSubSubCategory?: (_category: any) => void // \u8BBE\u7F6E\u5B50\u5B50\u5206\u7C7B\n  onSeriesProductClick?: (_seriesProduct: any, _position: number, _seriesLabel?: string) => void // \u8BBE\u7F6E\u7CFB\u5217\u4EA7\u54C1\u70B9\u51FB\n  onSidebarNavClick?: (_series: any, _index: number, _subSubindex?: number) => void // \u8BBE\u7F6E\u4FA7\u8FB9\u680F\u5BFC\u822A\u70B9\u51FB\n}\n\nconst initialState: NavContextType = {\n  isMobile: false,\n  payloadData: {},\n  buildProps: {\n    products: [],\n    categories: {},\n  },\n  currentMenu: HeaderNavigationMenu.Primary,\n  setCurrentMenu: () => {},\n  currentSeriesMetadata: {},\n  setCurrentSeriesMetadata: () => {},\n  onSeriesProductClick: (_seriesProduct: any, _position: number, _seriesLabel?: string) => {},\n  onSidebarNavClick: (_series: any) => {},\n  cartCount: 0,\n}\n\ntype Action =\n  | {\n      type: 'SET_CURRENT_MENU'\n      value: HeaderNavigationMenu\n    }\n  | {\n      type: 'SET_CURRENT_SERIES_METADATA'\n      value: any\n    }\n  | {\n      type: 'SET_SUB_SUB_CATEGORY'\n      value: any\n    }\nexport const NavContext = createContext<NavContextType>(initialState)\n\nexport const useNavContext = () => {\n  const context = useContext(NavContext)\n  if (!context) {\n    throw new Error('useNavContext must be used in <NavProvider>')\n  }\n  return useContext(NavContext)\n}\n\nconst reducer = (state: NavContextType, action: Action) => {\n  switch (action.type) {\n    case 'SET_CURRENT_MENU': {\n      return {\n        ...state,\n        currentMenu: action.value,\n      }\n    }\n    case 'SET_CURRENT_SERIES_METADATA': {\n      return {\n        ...state,\n        currentSeriesMetadata: action.value,\n      }\n    }\n    case 'SET_SUB_SUB_CATEGORY': {\n      return {\n        ...state,\n        subSubCategory: action.value,\n      }\n    }\n  }\n}\n\nconst NavProvider = ({\n  children,\n  ...rest\n}: {\n  children: React.ReactNode\n} & NavContextType) => {\n  const [state, dispatch] = useReducer(reducer, {\n    ...initialState,\n    currentMenu: HeaderNavigationMenu.Primary,\n    setCurrentMenu: () => {},\n  })\n\n  const setCurrentMenu = useCallback(\n    (value: HeaderNavigationMenu) => {\n      return dispatch({ type: 'SET_CURRENT_MENU', value })\n    },\n    [dispatch]\n  )\n\n  const setCurrentSeriesMetadata = useCallback(\n    (value: any) => {\n      return dispatch({ type: 'SET_CURRENT_SERIES_METADATA', value })\n    },\n    [dispatch]\n  )\n\n  const setSubSubCategory = useCallback(\n    (value: any) => {\n      return dispatch({ type: 'SET_SUB_SUB_CATEGORY', value })\n    },\n    [dispatch]\n  )\n\n  const value = useMemo(\n    () => ({\n      ...state,\n      setCurrentMenu,\n      setCurrentSeriesMetadata,\n      setSubSubCategory,\n    }),\n    [setCurrentMenu, setCurrentSeriesMetadata, setSubSubCategory, state]\n  )\n\n  return <NavContext.Provider value={{ ...value, ...rest }}>{children}</NavContext.Provider>\n}\n\nexport default NavProvider\n"],
-  "mappings": "AAyIS,cAAAA,MAAA,oBAzIT,OAAgB,iBAAAC,EAAe,eAAAC,EAAa,cAAAC,EAAY,WAAAC,EAAS,cAAAC,MAAkB,QAEnF,OAAS,wBAAAC,MAA4B,aA8BrC,MAAMC,EAA+B,CACnC,SAAU,GACV,YAAa,CAAC,EACd,WAAY,CACV,SAAU,CAAC,EACX,WAAY,CAAC,CACf,EACA,YAAaD,EAAqB,QAClC,eAAgB,IAAM,CAAC,EACvB,sBAAuB,CAAC,EACxB,yBAA0B,IAAM,CAAC,EACjC,qBAAsB,CAACE,EAAqBC,EAAmBC,IAA0B,CAAC,EAC1F,kBAAoBC,GAAiB,CAAC,EACtC,UAAW,CACb,EAeaC,EAAaX,EAA8BM,CAAY,EAEvDM,EAAgB,IAAM,CAEjC,GAAI,CADYV,EAAWS,CAAU,EAEnC,MAAM,IAAI,MAAM,6CAA6C,EAE/D,OAAOT,EAAWS,CAAU,CAC9B,EAEME,EAAU,CAACC,EAAuBC,IAAmB,CACzD,OAAQA,EAAO,KAAM,CACnB,IAAK,mBACH,MAAO,CACL,GAAGD,EACH,YAAaC,EAAO,KACtB,EAEF,IAAK,8BACH,MAAO,CACL,GAAGD,EACH,sBAAuBC,EAAO,KAChC,EAEF,IAAK,uBACH,MAAO,CACL,GAAGD,EACH,eAAgBC,EAAO,KACzB,CAEJ,CACF,EAEMC,EAAc,CAAC,CACnB,SAAAC,EACA,GAAGC,CACL,IAEuB,CACrB,KAAM,CAACJ,EAAOK,CAAQ,EAAIf,EAAWS,EAAS,CAC5C,GAAGP,EACH,YAAaD,EAAqB,QAClC,eAAgB,IAAM,CAAC,CACzB,CAAC,EAEKe,EAAiBnB,EACpBoB,GACQF,EAAS,CAAE,KAAM,mBAAoB,MAAAE,CAAM,CAAC,EAErD,CAACF,CAAQ,CACX,EAEMG,EAA2BrB,EAC9BoB,GACQF,EAAS,CAAE,KAAM,8BAA+B,MAAAE,CAAM,CAAC,EAEhE,CAACF,CAAQ,CACX,EAEMI,EAAoBtB,EACvBoB,GACQF,EAAS,CAAE,KAAM,uBAAwB,MAAAE,CAAM,CAAC,EAEzD,CAACF,CAAQ,CACX,EAEME,EAAQlB,EACZ,KAAO,CACL,GAAGW,EACH,eAAAM,EACA,yBAAAE,EACA,kBAAAC,CACF,GACA,CAACH,EAAgBE,EAA0BC,EAAmBT,CAAK,CACrE,EAEA,OAAOf,EAACY,EAAW,SAAX,CAAoB,MAAO,CAAE,GAAGU,EAAO,GAAGH,CAAK,EAAI,SAAAD,EAAS,CACtE,EAEA,IAAOO,EAAQR",
-  "names": ["jsx", "createContext", "useCallback", "useContext", "useMemo", "useReducer", "HeaderNavigationMenu", "initialState", "_seriesProduct", "_position", "_seriesLabel", "_series", "NavContext", "useNavContext", "reducer", "state", "action", "NavProvider", "children", "rest", "dispatch", "setCurrentMenu", "value", "setCurrentSeriesMetadata", "setSubSubCategory", "NavProvider_default"]
+  "sourcesContent": ["import React, { createContext, useCallback, useContext, useMemo, useReducer } from 'react'\nimport type { Product } from '../../cpn-components/CpnProductCard/types.js'\nimport { HeaderNavigationMenu } from './types.js'\nimport type { UserProfile } from './types.js'\n\ninterface NavContextType {\n  buildProps: {\n    products?: Product[] // \u4EA7\u54C1\u6570\u636E\n    categories?: Record<string, any> // \u5206\u7C7B\u6570\u636E\n  }\n  cartCount: number\n  event?: {\n    search?: () => void\n    cart?: () => void\n    profile?: () => void\n    livestream?: () => void\n    join?: () => void\n    login?: () => void\n  }\n  profile?: UserProfile // \u7528\u6237\u4FE1\u606F\n  isMobile?: boolean\n  payloadData: any\n  currentMenu?: HeaderNavigationMenu // \u5F53\u524D\u83DC\u5355\n  setCurrentMenu?: (_menu: HeaderNavigationMenu) => void // \u8BBE\u7F6E\u5F53\u524D\u83DC\u5355\n  currentSeriesMetadata?: any // \u5F53\u524D\u7CFB\u5217\u5143\u6570\u636E\n  setCurrentSeriesMetadata?: (_metadata: any) => void // \u8BBE\u7F6E\u5F53\u524D\u7CFB\u5217\u5143\u6570\u636E\n  subSubCategory?: any // \u5B50\u5B50\u5206\u7C7B\n  setSubSubCategory?: (_category: any) => void // \u8BBE\u7F6E\u5B50\u5B50\u5206\u7C7B\n  currentResourceMetadata?: any // \u5F53\u524D\u8D44\u6E90\u4F4D\u5143\u6570\u636E\n  setCurrentResourceMetadata?: (_metadata: any) => void // \u8BBE\u7F6E\u5F53\u524D\u8D44\u6E90\u4F4D\u5143\u6570\u636E\n  onSeriesProductClick?: (_seriesProduct: any, _position: number, _seriesLabel?: string) => void // \u8BBE\u7F6E\u7CFB\u5217\u4EA7\u54C1\u70B9\u51FB\n  onSidebarNavClick?: (_series: any, _index: number, _subSubindex?: number) => void // \u8BBE\u7F6E\u4FA7\u8FB9\u680F\u5BFC\u822A\u70B9\u51FB\n}\n\nconst initialState: NavContextType = {\n  isMobile: false,\n  payloadData: {},\n  buildProps: {\n    products: [],\n    categories: {},\n  },\n  currentMenu: HeaderNavigationMenu.Primary,\n  setCurrentMenu: () => {},\n  currentSeriesMetadata: {},\n  setCurrentSeriesMetadata: () => {},\n  currentResourceMetadata: {},\n  setCurrentResourceMetadata: () => {},\n  onSeriesProductClick: (_seriesProduct: any, _position: number, _seriesLabel?: string) => {},\n  onSidebarNavClick: (_series: any) => {},\n  cartCount: 0,\n}\n\ntype Action =\n  | {\n      type: 'SET_CURRENT_MENU'\n      value: HeaderNavigationMenu\n    }\n  | {\n      type: 'SET_CURRENT_SERIES_METADATA'\n      value: any\n    }\n  | {\n      type: 'SET_SUB_SUB_CATEGORY'\n      value: any\n    }\n  | {\n      type: 'SET_CURRENT_RESOURCE_METADATA'\n      value: any\n    }\nexport const NavContext = createContext<NavContextType>(initialState)\n\nexport const useNavContext = () => {\n  const context = useContext(NavContext)\n  if (!context) {\n    throw new Error('useNavContext must be used in <NavProvider>')\n  }\n  return useContext(NavContext)\n}\n\nconst reducer = (state: NavContextType, action: Action) => {\n  switch (action.type) {\n    case 'SET_CURRENT_MENU': {\n      return {\n        ...state,\n        currentMenu: action.value,\n      }\n    }\n    case 'SET_CURRENT_SERIES_METADATA': {\n      return {\n        ...state,\n        currentSeriesMetadata: action.value,\n      }\n    }\n    case 'SET_SUB_SUB_CATEGORY': {\n      return {\n        ...state,\n        subSubCategory: action.value,\n      }\n    }\n    case 'SET_CURRENT_RESOURCE_METADATA': {\n      return {\n        ...state,\n        currentResourceMetadata: action.value,\n      }\n    }\n  }\n}\n\nconst NavProvider = ({\n  children,\n  ...rest\n}: {\n  children: React.ReactNode\n} & NavContextType) => {\n  const [state, dispatch] = useReducer(reducer, {\n    ...initialState,\n    currentMenu: HeaderNavigationMenu.Primary,\n    setCurrentMenu: () => {},\n  })\n\n  const setCurrentMenu = useCallback(\n    (value: HeaderNavigationMenu) => {\n      return dispatch({ type: 'SET_CURRENT_MENU', value })\n    },\n    [dispatch]\n  )\n\n  const setCurrentSeriesMetadata = useCallback(\n    (value: any) => {\n      return dispatch({ type: 'SET_CURRENT_SERIES_METADATA', value })\n    },\n    [dispatch]\n  )\n\n  const setSubSubCategory = useCallback(\n    (value: any) => {\n      return dispatch({ type: 'SET_SUB_SUB_CATEGORY', value })\n    },\n    [dispatch]\n  )\n\n  const setCurrentResourceMetadata = useCallback(\n    (value: any) => {\n      return dispatch({ type: 'SET_CURRENT_RESOURCE_METADATA', value })\n    },\n    [dispatch]\n  )\n\n  const value = useMemo(\n    () => ({\n      ...state,\n      setCurrentMenu,\n      setCurrentSeriesMetadata,\n      setSubSubCategory,\n      setCurrentResourceMetadata,\n    }),\n    [setCurrentMenu, setCurrentSeriesMetadata, setSubSubCategory, setCurrentResourceMetadata, state]\n  )\n\n  return <NavContext.Provider value={{ ...value, ...rest }}>{children}</NavContext.Provider>\n}\n\nexport default NavProvider\n"],
+  "mappings": "AA+JS,cAAAA,MAAA,oBA/JT,OAAgB,iBAAAC,EAAe,eAAAC,EAAa,cAAAC,EAAY,WAAAC,EAAS,cAAAC,MAAkB,QAEnF,OAAS,wBAAAC,MAA4B,aAgCrC,MAAMC,EAA+B,CACnC,SAAU,GACV,YAAa,CAAC,EACd,WAAY,CACV,SAAU,CAAC,EACX,WAAY,CAAC,CACf,EACA,YAAaD,EAAqB,QAClC,eAAgB,IAAM,CAAC,EACvB,sBAAuB,CAAC,EACxB,yBAA0B,IAAM,CAAC,EACjC,wBAAyB,CAAC,EAC1B,2BAA4B,IAAM,CAAC,EACnC,qBAAsB,CAACE,EAAqBC,EAAmBC,IAA0B,CAAC,EAC1F,kBAAoBC,GAAiB,CAAC,EACtC,UAAW,CACb,EAmBaC,EAAaX,EAA8BM,CAAY,EAEvDM,EAAgB,IAAM,CAEjC,GAAI,CADYV,EAAWS,CAAU,EAEnC,MAAM,IAAI,MAAM,6CAA6C,EAE/D,OAAOT,EAAWS,CAAU,CAC9B,EAEME,EAAU,CAACC,EAAuBC,IAAmB,CACzD,OAAQA,EAAO,KAAM,CACnB,IAAK,mBACH,MAAO,CACL,GAAGD,EACH,YAAaC,EAAO,KACtB,EAEF,IAAK,8BACH,MAAO,CACL,GAAGD,EACH,sBAAuBC,EAAO,KAChC,EAEF,IAAK,uBACH,MAAO,CACL,GAAGD,EACH,eAAgBC,EAAO,KACzB,EAEF,IAAK,gCACH,MAAO,CACL,GAAGD,EACH,wBAAyBC,EAAO,KAClC,CAEJ,CACF,EAEMC,EAAc,CAAC,CACnB,SAAAC,EACA,GAAGC,CACL,IAEuB,CACrB,KAAM,CAACJ,EAAOK,CAAQ,EAAIf,EAAWS,EAAS,CAC5C,GAAGP,EACH,YAAaD,EAAqB,QAClC,eAAgB,IAAM,CAAC,CACzB,CAAC,EAEKe,EAAiBnB,EACpBoB,GACQF,EAAS,CAAE,KAAM,mBAAoB,MAAAE,CAAM,CAAC,EAErD,CAACF,CAAQ,CACX,EAEMG,EAA2BrB,EAC9BoB,GACQF,EAAS,CAAE,KAAM,8BAA+B,MAAAE,CAAM,CAAC,EAEhE,CAACF,CAAQ,CACX,EAEMI,EAAoBtB,EACvBoB,GACQF,EAAS,CAAE,KAAM,uBAAwB,MAAAE,CAAM,CAAC,EAEzD,CAACF,CAAQ,CACX,EAEMK,EAA6BvB,EAChCoB,GACQF,EAAS,CAAE,KAAM,gCAAiC,MAAAE,CAAM,CAAC,EAElE,CAACF,CAAQ,CACX,EAEME,EAAQlB,EACZ,KAAO,CACL,GAAGW,EACH,eAAAM,EACA,yBAAAE,EACA,kBAAAC,EACA,2BAAAC,CACF,GACA,CAACJ,EAAgBE,EAA0BC,EAAmBC,EAA4BV,CAAK,CACjG,EAEA,OAAOf,EAACY,EAAW,SAAX,CAAoB,MAAO,CAAE,GAAGU,EAAO,GAAGH,CAAK,EAAI,SAAAD,EAAS,CACtE,EAEA,IAAOQ,EAAQT",
+  "names": ["jsx", "createContext", "useCallback", "useContext", "useMemo", "useReducer", "HeaderNavigationMenu", "initialState", "_seriesProduct", "_position", "_seriesLabel", "_series", "NavContext", "useNavContext", "reducer", "state", "action", "NavProvider", "children", "rest", "dispatch", "setCurrentMenu", "value", "setCurrentSeriesMetadata", "setSubSubCategory", "setCurrentResourceMetadata", "NavProvider_default"]
 }

package/dist/esm/biz-components/HeaderNavigation/ResourceItem.d.ts

@@ -0,0 +1,20 @@
+/**
+ * 资源位项组件 - 桌面端
+ */
+export declare const ResourceItem: ({ resource }: {
+    resource: any;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * 资源位子分类标题组件 - 移动端
+ */
+export declare const ResourceSubSubCategoryItemComp: ({ matchResourcesMetadata, onSubSubCategoryItemClick, expanded, }: {
+    matchResourcesMetadata: any;
+    onSubSubCategoryItemClick?: () => void;
+    expanded?: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * 资源位子分类内容组件 - 移动端
+ */
+export declare const ResourceSubSubCategoryContentComp: ({ matchResourcesMetadata }: {
+    matchResourcesMetadata: any;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/biz-components/HeaderNavigation/ResourceItem.js

@@ -0,0 +1,2 @@
+import{Fragment as m,jsx as e,jsxs as o}from"react/jsx-runtime";import{Picture as d,Text as l,Link as r}from"../../components/index.js";import{cn as i}from"../../helpers/utils.js";const x=({resource:t})=>e("div",{className:"laptop:h-[280px] desktop:h-[224px] lg-desktop:h-[280px] tablet:max-w-none desktop:w-full relative h-[240px] max-w-[358px] overflow-hidden",children:e(r,{href:t?.href,className:"no-underline hover:text-current",children:o("div",{className:"relative h-full overflow-hidden [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[e(d,{source:t.imageUrl,width:404,height:280,className:"size-full",imgClassName:"object-cover h-full hover:scale-105 transition-all duration-300"}),o("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[e(l,{as:"p",html:t?.title,className:i("text-xl font-bold leading-[1.2]",{"text-white":t?.theme!=="dark","text-black":t?.theme==="dark"})}),t?.desc&&e(l,{html:t?.desc,className:i("text-sm font-bold leading-[1.4]",{"text-white":t?.theme!=="dark","text-black":t?.theme==="dark"})})]})]})})}),v=({matchResourcesMetadata:t,onSubSubCategoryItemClick:a,expanded:s})=>{const n=o(m,{children:[t?.label&&e(l,{html:t?.label,className:"text-sm font-bold leading-[1.4]"}),a&&e("svg",{className:i("size-5",{"rotate-180":s}),viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:e("path",{d:"M6 9L12 15L18 9",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})]});return a?e("button",{className:"flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left",onClick:a,"aria-expanded":s,children:n}):e("div",{className:"flex items-center justify-between py-4",children:n})},p=({matchResourcesMetadata:t})=>e("div",{className:"tablet:grid tablet:grid-cols-2 flex grid-cols-1 flex-col gap-4",children:!!t?.resources?.length&&t?.resources?.map((a,s)=>e(r,{href:a?.href,className:"no-underline hover:text-current",children:e("div",{className:"laptop:h-[280px] tablet:max-w-none relative h-[240px] max-w-[358px]",children:o("div",{className:"relative h-full overflow-hidden",children:[e(d,{source:a.imageUrl,width:404,height:280,className:"size-full",imgClassName:"object-cover h-full hover:scale-105 transition-all duration-300"}),o("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[e(l,{html:a?.title,as:"p",className:i("text-xl font-bold leading-[1.2]",{"text-white":a?.theme!=="dark","text-black":a?.theme==="dark"})}),a?.desc&&e(l,{html:a?.desc,className:i("text-sm font-bold leading-[1.4]",{"text-white":a?.theme!=="dark","text-black":a?.theme==="dark"})})]})]})})},`resourceItem-${s}`))});export{x as ResourceItem,p as ResourceSubSubCategoryContentComp,v as ResourceSubSubCategoryItemComp};
+//# sourceMappingURL=ResourceItem.js.map

package/dist/esm/biz-components/HeaderNavigation/ResourceItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/HeaderNavigation/ResourceItem.tsx"],
+  "sourcesContent": ["import { Picture, Text, Link } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\n\n/**\n * \u8D44\u6E90\u4F4D\u9879\u7EC4\u4EF6 - \u684C\u9762\u7AEF\n */\nexport const ResourceItem = ({ resource }: { resource: any }) => {\n  return (\n    <div className=\"laptop:h-[280px] desktop:h-[224px] lg-desktop:h-[280px] tablet:max-w-none desktop:w-full relative h-[240px] max-w-[358px] overflow-hidden\">\n      <Link href={resource?.href} className=\"no-underline hover:text-current\">\n        <div className=\"relative h-full overflow-hidden [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500\">\n          <Picture\n            source={resource.imageUrl}\n            width={404}\n            height={280}\n            className=\"size-full\"\n            imgClassName=\"object-cover h-full hover:scale-105 transition-all duration-300\"\n          />\n          <div className=\"absolute inset-x-0 bottom-0 p-4\">\n            <Text\n              as=\"p\"\n              html={resource?.title}\n              className={cn('text-xl font-bold leading-[1.2]', {\n                'text-white': resource?.theme !== 'dark',\n                'text-black': resource?.theme === 'dark',\n              })}\n            />\n            {resource?.desc && (\n              <Text\n                html={resource?.desc}\n                className={cn('text-sm font-bold leading-[1.4]', {\n                  'text-white': resource?.theme !== 'dark',\n                  'text-black': resource?.theme === 'dark',\n                })}\n              />\n            )}\n          </div>\n        </div>\n      </Link>\n    </div>\n  )\n}\n\n/**\n * \u8D44\u6E90\u4F4D\u5B50\u5206\u7C7B\u6807\u9898\u7EC4\u4EF6 - \u79FB\u52A8\u7AEF\n */\nexport const ResourceSubSubCategoryItemComp = ({\n  matchResourcesMetadata,\n  onSubSubCategoryItemClick,\n  expanded,\n}: {\n  matchResourcesMetadata: any\n  onSubSubCategoryItemClick?: () => void\n  expanded?: boolean\n}) => {\n  const content = (\n    <>\n      {matchResourcesMetadata?.label && (\n        <Text html={matchResourcesMetadata?.label} className=\"text-sm font-bold leading-[1.4]\" />\n      )}\n      {onSubSubCategoryItemClick && (\n        <svg\n          className={cn('size-5', {\n            ['rotate-180']: expanded,\n          })}\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          aria-hidden=\"true\"\n        >\n          <path\n            d=\"M6 9L12 15L18 9\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      )}\n    </>\n  )\n\n  return onSubSubCategoryItemClick ? (\n    <button\n      className=\"flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-4 text-left\"\n      onClick={onSubSubCategoryItemClick}\n      aria-expanded={expanded}\n    >\n      {content}\n    </button>\n  ) : (\n    <div className=\"flex items-center justify-between py-4\">{content}</div>\n  )\n}\n\n/**\n * \u8D44\u6E90\u4F4D\u5B50\u5206\u7C7B\u5185\u5BB9\u7EC4\u4EF6 - \u79FB\u52A8\u7AEF\n */\nexport const ResourceSubSubCategoryContentComp = ({ matchResourcesMetadata }: { matchResourcesMetadata: any }) => {\n  return (\n    <div className=\"tablet:grid tablet:grid-cols-2 flex grid-cols-1 flex-col gap-4\">\n      {!!matchResourcesMetadata?.resources?.length &&\n        matchResourcesMetadata?.resources?.map((resourceItem: any, rIndex: number) => (\n          <Link key={`resourceItem-${rIndex}`} href={resourceItem?.href} className=\"no-underline hover:text-current\">\n            <div className=\"laptop:h-[280px] tablet:max-w-none relative h-[240px] max-w-[358px]\">\n              <div className=\"relative h-full overflow-hidden\">\n                <Picture\n                  source={resourceItem.imageUrl}\n                  width={404}\n                  height={280}\n                  className=\"size-full\"\n                  imgClassName=\"object-cover h-full hover:scale-105 transition-all duration-300\"\n                />\n                <div className=\"absolute inset-x-0 bottom-0 p-4\">\n                  <Text\n                    html={resourceItem?.title}\n                    as=\"p\"\n                    className={cn('text-xl font-bold leading-[1.2]', {\n                      'text-white': resourceItem?.theme !== 'dark',\n                      'text-black': resourceItem?.theme === 'dark',\n                    })}\n                  />\n                  {resourceItem?.desc && (\n                    <Text\n                      html={resourceItem?.desc}\n                      className={cn('text-sm font-bold leading-[1.4]', {\n                        'text-white': resourceItem?.theme !== 'dark',\n                        'text-black': resourceItem?.theme === 'dark',\n                      })}\n                    />\n                  )}\n                </div>\n              </div>\n            </div>\n          </Link>\n        ))}\n    </div>\n  )\n}\n"],
+  "mappings": "AAWU,OA6CN,YAAAA,EA7CM,OAAAC,EAOA,QAAAC,MAPA,oBAXV,OAAS,WAAAC,EAAS,QAAAC,EAAM,QAAAC,MAAY,4BACpC,OAAS,MAAAC,MAAU,yBAKZ,MAAMC,EAAe,CAAC,CAAE,SAAAC,CAAS,IAEpCP,EAAC,OAAI,UAAU,4IACb,SAAAA,EAACI,EAAA,CAAK,KAAMG,GAAU,KAAM,UAAU,kCACpC,SAAAN,EAAC,OAAI,UAAU,kHACb,UAAAD,EAACE,EAAA,CACC,OAAQK,EAAS,SACjB,MAAO,IACP,OAAQ,IACR,UAAU,YACV,aAAa,kEACf,EACAN,EAAC,OAAI,UAAU,kCACb,UAAAD,EAACG,EAAA,CACC,GAAG,IACH,KAAMI,GAAU,MAChB,UAAWF,EAAG,kCAAmC,CAC/C,aAAcE,GAAU,QAAU,OAClC,aAAcA,GAAU,QAAU,MACpC,CAAC,EACH,EACCA,GAAU,MACTP,EAACG,EAAA,CACC,KAAMI,GAAU,KAChB,UAAWF,EAAG,kCAAmC,CAC/C,aAAcE,GAAU,QAAU,OAClC,aAAcA,GAAU,QAAU,MACpC,CAAC,EACH,GAEJ,GACF,EACF,EACF,EAOSC,EAAiC,CAAC,CAC7C,uBAAAC,EACA,0BAAAC,EACA,SAAAC,CACF,IAIM,CACJ,MAAMC,EACJX,EAAAF,EAAA,CACG,UAAAU,GAAwB,OACvBT,EAACG,EAAA,CAAK,KAAMM,GAAwB,MAAO,UAAU,kCAAkC,EAExFC,GACCV,EAAC,OACC,UAAWK,EAAG,SAAU,CACrB,aAAeM,CAClB,CAAC,EACD,QAAQ,YACR,KAAK,OACL,MAAM,6BACN,cAAY,OAEZ,SAAAX,EAAC,QACC,EAAE,kBACF,OAAO,eACP,YAAY,IACZ,cAAc,QACd,eAAe,QACjB,EACF,GAEJ,EAGF,OAAOU,EACLV,EAAC,UACC,UAAU,iGACV,QAASU,EACT,gBAAeC,EAEd,SAAAC,EACH,EAEAZ,EAAC,OAAI,UAAU,yCAA0C,SAAAY,EAAQ,CAErE,EAKaC,EAAoC,CAAC,CAAE,uBAAAJ,CAAuB,IAEvET,EAAC,OAAI,UAAU,iEACZ,UAAC,CAACS,GAAwB,WAAW,QACpCA,GAAwB,WAAW,IAAI,CAACK,EAAmBC,IACzDf,EAACI,EAAA,CAAoC,KAAMU,GAAc,KAAM,UAAU,kCACvE,SAAAd,EAAC,OAAI,UAAU,sEACb,SAAAC,EAAC,OAAI,UAAU,kCACb,UAAAD,EAACE,EAAA,CACC,OAAQY,EAAa,SACrB,MAAO,IACP,OAAQ,IACR,UAAU,YACV,aAAa,kEACf,EACAb,EAAC,OAAI,UAAU,kCACb,UAAAD,EAACG,EAAA,CACC,KAAMW,GAAc,MACpB,GAAG,IACH,UAAWT,EAAG,kCAAmC,CAC/C,aAAcS,GAAc,QAAU,OACtC,aAAcA,GAAc,QAAU,MACxC,CAAC,EACH,EACCA,GAAc,MACbd,EAACG,EAAA,CACC,KAAMW,GAAc,KACpB,UAAWT,EAAG,kCAAmC,CAC/C,aAAcS,GAAc,QAAU,OACtC,aAAcA,GAAc,QAAU,MACxC,CAAC,EACH,GAEJ,GACF,EACF,GA9BS,gBAAgBC,CAAM,EA+BjC,CACD,EACL",
+  "names": ["Fragment", "jsx", "jsxs", "Picture", "Text", "Link", "cn", "ResourceItem", "resource", "ResourceSubSubCategoryItemComp", "matchResourcesMetadata", "onSubSubCategoryItemClick", "expanded", "content", "ResourceSubSubCategoryContentComp", "resourceItem", "rIndex"]
+}

package/dist/esm/biz-components/HeaderNavigation/ResourceSidebarDropdown.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+/**
+ * 资源位侧边栏下拉
+ * @param categoriesItem 分类项
+ */
+export declare const ResourceSidebarDropdown: React.MemoExoticComponent<({ resourceCategoriesMetadata, resourcesMetadata }: {
+    resourceCategoriesMetadata: any;
+    resourcesMetadata: any;
+}) => import("react/jsx-runtime").JSX.Element>;

package/dist/esm/biz-components/HeaderNavigation/ResourceSidebarDropdown.js

@@ -0,0 +1,2 @@
+import{jsx as r,jsxs as i}from"react/jsx-runtime";import C,{useCallback as x,useEffect as R,useMemo as A,useRef as F,useState as v}from"react";import{Button as S,Container as $,Text as h}from"../../components/index.js";import{cn as m}from"../../helpers/utils.js";import{DownArrow as D}from"./icons/index.js";import{useNavContext as E}from"./NavProvider.js";import{ResourceItem as L}from"./ResourceItem.js";const O=C.memo(({resourceCategoriesMetadata:s,resourcesMetadata:u})=>{const{onSidebarNavClick:f}=E(),[c,b]=v([]),[p,d]=v(-1),w=F(null),y=x(()=>{const e=s?.subcategories;if(!e?.length)return;const o=e.findIndex(t=>!!t?.subSubCategories),n=e.findIndex(t=>!t?.subSubCategories),a=e.map((t,l)=>({index:l,open:o===l||n===l}));b(a)},[s]);R(()=>{y()},[y]);const g=A(()=>{const e=s?.subcategories?.[c?.find(n=>n.open)?.index||0],o=u?.find(n=>n?.label?.toLowerCase()===e?.label?.toLowerCase())||{};if(e?.subSubCategories){const n=e?.subSubCategories?.[p];return u?.find(t=>t?.label?.toLowerCase()===n?.label?.toLowerCase())||{}}else return o},[s,c,p,u]),N=x((e,o)=>{o?.subSubCategories?.length>0?d(0):d(-1),b(n=>n.map((a,t)=>({...a,open:t===e?!a.open:!1})))},[]),k=(e,o)=>{b(n=>n.map(a=>a.index===e?{...a,open:!0}:{...a,open:!1})),d(o)};return i($,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[i("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:w,children:[r("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:s?.subcategories?.map((e,o)=>{const n=Array.isArray(e?.subSubCategories)&&e?.subSubCategories?.length>0,a=c?.find(t=>t.index===o)?.open;return i("div",{children:[i("button",{className:m("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left",{"bg-[#F5F5F7]":!n&&a}),onClick:()=>{N(o,e),f?.(e,o)},"aria-expanded":n?a:void 0,"aria-haspopup":n?"true":void 0,children:[r(h,{html:e.label,className:"p-4 text-sm font-bold leading-[1.4]"}),n&&r(D,{"aria-hidden":"true",className:m("size-4",{"rotate-180":a})})]}),a&&r("div",{className:"flex flex-col",role:"menu",children:e.subSubCategories?.map((t,l)=>r("button",{onClick:()=>{k(o,l),f?.(t,l)},className:m("w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]",{"bg-[#F5F5F7]":p===l}),role:"menuitem","aria-label":t.label,children:r(h,{html:t.label,className:"text-sm font-bold leading-[1.4] text-[#4A4C56]"})},`subSubItem-${o}-${l}`))})]},`subcategoryItem-${o}`)})}),s&&r("div",{className:"flex",children:i("div",{className:"flex flex-col gap-4",children:[s?.primary&&r(S,{as:"a",href:`${s?.primary?.url}?ref=${s?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"lg-desktop:text-base text-sm",children:s?.primary?.label}),s?.secondary&&r(S,{as:"a",href:s?.secondary?.url,variant:"link",size:"lg",className:"lg-desktop:text-base justify-start !p-0 text-sm",children:s?.secondary?.label})]})})]}),r("div",{className:"desktop:h-[509px] flex-1 overflow-y-auto py-4",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:r("div",{className:"grid grid-cols-3 gap-4 ",children:Array.isArray(g?.resources)?g.resources.map((e,o)=>r(L,{resource:e},`resourceItem-${o}`)):null})})]})});O.displayName="ResourceSidebarDropdown";export{O as ResourceSidebarDropdown};
+//# sourceMappingURL=ResourceSidebarDropdown.js.map

package/dist/esm/biz-components/HeaderNavigation/ResourceSidebarDropdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/HeaderNavigation/ResourceSidebarDropdown.tsx"],
+  "sourcesContent": ["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { Button, Container, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { DownArrow } from './icons/index.js'\nimport { useNavContext } from './NavProvider.js'\nimport { ResourceItem } from './ResourceItem.js'\n\n/**\n * \u8D44\u6E90\u4F4D\u4FA7\u8FB9\u680F\u4E0B\u62C9\n * @param categoriesItem \u5206\u7C7B\u9879\n */\nexport const ResourceSidebarDropdown = React.memo(\n  ({ resourceCategoriesMetadata, resourcesMetadata }: { resourceCategoriesMetadata: any; resourcesMetadata: any }) => {\n    const { onSidebarNavClick } = useNavContext()\n    const [expandedSubcategory, setExpandedSubcategory] = useState<{ index: number; open: boolean }[]>([])\n    const [activeSubSubcategoryIndex, setActiveSubSubcategoryIndex] = useState(-1)\n    const resourceDropdownRef = useRef<HTMLDivElement>(null)\n\n    const initExpandedSubcategory = useCallback(() => {\n      const subcategories = resourceCategoriesMetadata?.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    }, [resourceCategoriesMetadata])\n\n    useEffect(() => {\n      initExpandedSubcategory()\n    }, [initExpandedSubcategory])\n\n    // \u901A\u8FC7categoriesMetadata\u7684subSubCategories\u7684label\u4E0Eresources\u7684label\u5339\u914D\n    const matchResourcesMetadata = useMemo(() => {\n      const subCategory =\n        resourceCategoriesMetadata?.subcategories?.[expandedSubcategory?.find(item => item.open)?.index || 0]\n      const currentResourcesMetadata =\n        resourcesMetadata?.find((item: any) => item?.label?.toLowerCase() === subCategory?.label?.toLowerCase()) || {}\n\n      if (subCategory?.subSubCategories) {\n        const activeSubSubcategory = subCategory?.subSubCategories?.[activeSubSubcategoryIndex]\n        const currentActiveResourcesMetadata =\n          resourcesMetadata?.find(\n            (item: any) => item?.label?.toLowerCase() === activeSubSubcategory?.label?.toLowerCase()\n          ) || {}\n        return currentActiveResourcesMetadata\n      } else {\n        return currentResourcesMetadata\n      }\n    }, [resourceCategoriesMetadata, expandedSubcategory, activeSubSubcategoryIndex, resourcesMetadata])\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={resourceDropdownRef}\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            {resourceCategoriesMetadata?.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          {resourceCategoriesMetadata && (\n            <div className=\"flex\">\n              <div className=\"flex flex-col gap-4\">\n                {resourceCategoriesMetadata?.primary && (\n                  <Button\n                    as=\"a\"\n                    href={`${resourceCategoriesMetadata?.primary?.url}?ref=${resourceCategoriesMetadata?.primary?.label}_shopall`}\n                    variant=\"primary\"\n                    size=\"lg\"\n                    className=\"lg-desktop:text-base text-sm\"\n                  >\n                    {resourceCategoriesMetadata?.primary?.label}\n                  </Button>\n                )}\n                {resourceCategoriesMetadata?.secondary && (\n                  <Button\n                    as=\"a\"\n                    href={resourceCategoriesMetadata?.secondary?.url}\n                    variant=\"link\"\n                    size=\"lg\"\n                    className=\"lg-desktop:text-base justify-start !p-0 text-sm\"\n                  >\n                    {resourceCategoriesMetadata?.secondary?.label}\n                  </Button>\n                )}\n              </div>\n            </div>\n          )}\n        </div>\n        <div\n          className=\"desktop:h-[509px] flex-1 overflow-y-auto py-4\"\n          style={{\n            scrollbarWidth: 'none',\n            msOverflowStyle: 'none',\n          }}\n        >\n          <div className=\"grid grid-cols-3 gap-4 \">\n            {Array.isArray(matchResourcesMetadata?.resources)\n              ? matchResourcesMetadata.resources.map((resourceItem: any, resourceIndex: number) => (\n                  <ResourceItem key={`resourceItem-${resourceIndex}`} resource={resourceItem} />\n                ))\n              : null}\n          </div>\n        </div>\n      </Container>\n    )\n  }\n)\n\nResourceSidebarDropdown.displayName = 'ResourceSidebarDropdown'\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "React", "useCallback", "useEffect", "useMemo", "useRef", "useState", "Button", "Container", "Text", "cn", "DownArrow", "useNavContext", "ResourceItem", "ResourceSidebarDropdown", "resourceCategoriesMetadata", "resourcesMetadata", "onSidebarNavClick", "expandedSubcategory", "setExpandedSubcategory", "activeSubSubcategoryIndex", "setActiveSubSubcategoryIndex", "resourceDropdownRef", "initExpandedSubcategory", "subcategories", "withSubSubCategoriesIndex", "item", "withoutSubSubCategoriesIndex", "expandedStates", "_", "index", "matchResourcesMetadata", "subCategory", "currentResourcesMetadata", "activeSubSubcategory", "handleSubcategoryOpen", "subcategoryItem", "prev", "i", "handleSubSubcategoryOpen", "subSubindex", "subItem", "hasSubSubCategory", "isExpanded", "subSubItem", "resourceItem", "resourceIndex"]
+}

package/dist/esm/biz-components/HeaderNavigation/SidebarDropdown.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+/**
+ * 侧边栏下拉
+ * @param categoriesItem 分类项
+ */
+export declare const SidebarDropdown: React.MemoExoticComponent<({ sidebarCategoriesMetadata, seriesMetadata }: {
+    sidebarCategoriesMetadata: any;
+    seriesMetadata: any;
+}) => import("react/jsx-runtime").JSX.Element>;
+/**
+ * 系列产品项组件
+ */
+export declare const SeriesProductItem: ({ product, isCollection, position, seriesLabel, }: {
+    product: any;
+    isCollection?: boolean;
+    position?: number;
+    seriesLabel?: string;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/dist/esm/biz-components/HeaderNavigation/SidebarDropdown.js

@@ -0,0 +1,2 @@
+import{jsx as t,jsxs as i}from"react/jsx-runtime";import $,{useCallback as C,useEffect as P,useMemo as k,useRef as A,useState as F}from"react";import{Button as S,Container as z,Text as u,Link as w,Heading as _,Picture as j}from"../../components/index.js";import{cn as y,atobID as B}from"../../helpers/utils.js";import{DownArrow as E}from"./icons/index.js";import{useNavContext as D}from"./NavProvider.js";const O=$.memo(({sidebarCategoriesMetadata:l,seriesMetadata:p})=>{const{buildProps:b,onSidebarNavClick:h}=D(),[g,f]=F([]),[c,d]=F(-1),v=A(null),x=C(()=>{const a=l?.subcategories;if(!a?.length)return;const r=a.findIndex(o=>!!o?.subSubCategories),n=a.findIndex(o=>!o?.subSubCategories),s=a.map((o,m)=>({index:m,open:r===m||n===m}));f(s)},[l]);P(()=>{x()},[x]);const e=k(()=>{const a=l?.subcategories?.[g?.find(n=>n.open)?.index||0],r=p?.find(n=>n?.label?.toLowerCase()===a?.label?.toLowerCase())||{};if(a?.collections){const n=b?.categories?.[a?.collections]||{};return{label:r?.label,isCollection:!0,banner:r?.banner,primary:r?.primary,guide:r?.guide,series:[{products:n?.products}]}}else if(a?.subSubCategories){const n=a?.subSubCategories?.[c],s=p?.find(o=>o?.label?.toLowerCase()===n?.label?.toLowerCase())||{};if(n?.collections){const o=b?.categories?.[n?.collections]||{};return{label:s?.label,isCollection:!0,banner:s?.banner,primary:s?.primary,guide:s?.guide,series:[{products:o?.products}]}}else return s}else return r},[l,g,c,p,b]),N=C((a,r)=>{r?.subSubCategories?.length>0?d(0):d(-1),f(n=>n.map((s,o)=>({...s,open:o===a?!s.open:!1})))},[]),L=(a,r)=>{f(n=>n.map(s=>s.index===a?{...s,open:!0}:{...s,open:!1})),d(r)};return i(z,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[i("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:v,children:[t("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:l?.subcategories?.map((a,r)=>{const n=Array.isArray(a?.subSubCategories)&&a?.subSubCategories?.length>0,s=g?.find(o=>o.index===r)?.open;return i("div",{children:[i("button",{className:y("flex w-full cursor-pointer items-center justify-between border-0 bg-transparent text-left",{"bg-[#F5F5F7]":!n&&s}),onClick:()=>{N(r,a),h?.(a,r)},"aria-expanded":n?s:void 0,"aria-haspopup":n?"true":void 0,children:[t(u,{html:a.label,className:"p-4 text-sm font-bold leading-[1.4]"}),n&&t(E,{"aria-hidden":"true",className:y("size-4",{"rotate-180":s})})]}),s&&t("div",{className:"flex flex-col",role:"menu",children:a.subSubCategories?.map((o,m)=>t("button",{onClick:()=>{L(r,m),h?.(o,m)},className:y("w-full cursor-pointer border-0 bg-transparent px-6 py-4 text-left hover:bg-[#F5F5F7]",{"bg-[#F5F5F7]":c===m}),role:"menuitem","aria-label":o.label,children:t(u,{html:o.label,className:"text-sm font-bold leading-[1.4] text-[#4A4C56]"})},`subSubItem-${r}-${m}`))})]},`subcategoryItem-${r}`)})}),l&&t("div",{className:"flex",children:i("div",{className:"flex flex-col gap-4",children:[l?.primary&&t(S,{as:"a",href:`${l?.primary?.url}?ref=${l?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"lg-desktop:text-base text-sm",children:l?.primary?.label}),l?.secondary&&t(S,{as:"a",href:l?.secondary?.url,variant:"link",size:"lg",iconClassName:"size-4",className:"lg-desktop:text-base justify-start !p-0 text-sm",children:l?.secondary?.label})]})})]}),i("div",{className:"flex-1 py-4",children:[Reflect.ownKeys(e).length>0&&i("div",{className:"mb-4 flex items-center justify-between",children:[i("div",{className:"flex items-center gap-2",children:[t(u,{html:e?.label,className:"lg-desktop:text-2xl text-xl font-bold leading-[1.4]"}),e?.primary&&!e?.primary?.hide&&t(S,{as:"a",href:`${e?.primary?.url}?ref=${e?.label}_viewmore`,variant:"link",size:"lg",iconClassName:"size-4",className:"lg-desktop:text-base justify-start !p-0 text-sm font-bold leading-[1.2] no-underline",children:e?.primary?.label})]}),t(w,{href:e?.guide?.url,className:"lg-desktop:text-base text-sm leading-[1.2] text-[#6D6D6F]",children:e?.guide?.label})]}),t("div",{className:"flex h-[426px] flex-col gap-4 overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:e?.series?.map((a,r)=>i("div",{children:[a.label&&t(u,{html:a.label,as:"p",className:"mb-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),i("div",{className:"grid grid-cols-3 gap-4",children:[!!e?.banner&&t(w,{asChild:!e?.banner?.href,href:e?.banner?.href,children:i("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-500",children:[t(j,{source:e?.banner?.imageUrl,className:"laptop:h-[120px] h-[114px]",imgClassName:"object-cover h-full"}),i("div",{className:"absolute inset-x-0 bottom-0 p-4",children:[t(_,{size:2,html:e?.banner?.title||"Buy in Guide",className:y("font-bold text-white",{"text-black":e?.banner?.theme==="dark"})}),t(u,{html:e?.banner?.desc||"20.000mAh",className:y("text-sm font-bold text-white",{"text-black":e?.banner?.theme==="dark"})})]})]})}),a.products?.map((n,s)=>t(R,{seriesLabel:e?.label,product:n,isCollection:e?.isCollection},`seriesProductItem-${s}`))]})]},`seriesItem-${r}`))})]})]})});O.displayName="SidebarDropdown";const R=({product:l,isCollection:p,position:b,seriesLabel:h})=>{const{buildProps:g,onSeriesProductClick:f}=D();let c=p?l:g?.products?.find(e=>e.handle===l.handle);const d=c?.variants?.find(e=>e.sku===l.sku)||c?.variants?.[0],v=k(()=>`/products/${c?.handle}?variant=${B(d?.id)}`,[c?.handle,d?.id]),x=k(()=>c?.tags?.filter?.(e=>e?.startsWith?.("CLtag"))?.map?.(e=>e?.replace?.("CLtag:",""))?.slice?.(0,2),[c?.tags]);return d?.availableForSale?t(w,{href:v,onClick:e=>{e.preventDefault(),window.open(v,"_self"),f?.(c,b||0,h)},className:"no-underline hover:text-current",children:i("div",{className:"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110 [&_img]:hover:duration-500",children:[t("div",{className:"shrink-0",children:t("img",{src:`${d?.image?.url||l?.images?.[0]?.url}`,loading:"lazy",alt:c?.title||l?.name,width:90,height:90,className:"size-[96px] object-contain"})}),i("div",{className:"relative",children:[t("div",{className:"flex gap-1",children:Array.isArray(x)&&x?.map((e,N)=>t(u,{as:"p",html:e,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))}),t(u,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:c?.title||l?.name}),l?.desc&&t(u,{as:"p",html:l?.desc,className:"lg-desktop:text-sm mt-1 line-clamp-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]})}):null};export{R as SeriesProductItem,O as SidebarDropdown};
+//# sourceMappingURL=SidebarDropdown.js.map

package/dist/esm/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": ["jsx", "jsxs", "React", "useCallback", "useEffect", "useMemo", "useRef", "useState", "Button", "Container", "Text", "Link", "Heading", "Picture", "cn", "atobID", "DownArrow", "useNavContext", "SidebarDropdown", "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", "SeriesProductItem", "isCollection", "position", "seriesLabel", "onSeriesProductClick", "productData", "variant", "listingLink", "tags", "tag"]
+}

package/dist/esm/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/esm/biz-components/HeaderNavigation/SupportsDropdown.js

@@ -0,0 +1,2 @@
+import{jsx as i}from"react/jsx-runtime";import{useEffect as s,useRef as u,useState as l}from"react";import{Link as g}from"../../components/index.js";import{debounce as f}from"es-toolkit";const D=({supportsMetadata:d,currentNavItemRef:t})=>{const n=u(null),[a,r]=l(null),[c,p]=l(0);s(()=>{if(n?.current){const e=n?.current?.getBoundingClientRect();p(e.height)}},[n]);const o=f(()=>{if(t){const e=t.getBoundingClientRect();r(e)}},500);return s(()=>(o(),window.addEventListener("resize",o),()=>{window.removeEventListener("resize",o)}),[o]),s(()=>{if(t){const e=t.getBoundingClientRect();r(e)}},[t]),i("div",{className:"absolute top-0 h-full overflow-hidden bg-white transition-all duration-500",style:{right:`calc(100% - ${a?.right}px)`,height:c},children:i("div",{ref:n,className:"p-4",children:d?.map(e=>i("div",{className:"py-2",children:i(g,{href:e.url,className:"text-sm font-bold leading-[1.4] no-underline",children:e.label})},e.id))})})};export{D as SupportsDropdown};
+//# sourceMappingURL=SupportsDropdown.js.map

package/dist/esm/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": "AAyDY,cAAAA,MAAA,oBAzDZ,OAAgB,aAAAC,EAAW,UAAAC,EAAQ,YAAAC,MAAgB,QACnD,OAAS,QAAAC,MAAY,4BACrB,OAAS,YAAAC,MAAgB,aAOlB,MAAMC,EAAmB,CAAC,CAC/B,iBAAAC,EACA,kBAAAC,CACF,IAGM,CACJ,MAAMC,EAAsBP,EAAuB,IAAI,EACjD,CAACQ,EAAcC,CAAe,EAAIR,EAAyB,IAAI,EAC/D,CAACS,EAAwBC,CAAyB,EAAIV,EAAS,CAAC,EAEtEF,EAAU,IAAM,CACd,GAAIQ,GAAqB,QAAS,CAChC,MAAMK,EAAOL,GAAqB,SAAS,sBAAsB,EACjEI,EAA0BC,EAAK,MAAM,CACvC,CACF,EAAG,CAACL,CAAmB,CAAC,EAExB,MAAMM,EAAwBV,EAAS,IAAM,CAC3C,GAAIG,EAAmB,CACrB,MAAMM,EAAON,EAAkB,sBAAsB,EACrDG,EAAgBG,CAAI,CACtB,CACF,EAAG,GAAG,EAEN,OAAAb,EAAU,KACRc,EAAsB,EACtB,OAAO,iBAAiB,SAAUA,CAAqB,EAChD,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAqB,CAC5D,GACC,CAACA,CAAqB,CAAC,EAE1Bd,EAAU,IAAM,CACd,GAAIO,EAAmB,CACrB,MAAMM,EAAON,EAAkB,sBAAsB,EACrDG,EAAgBG,CAAI,CACtB,CACF,EAAG,CAACN,CAAiB,CAAC,EAGpBR,EAAC,OACC,UAAU,6EACV,MAAO,CAAE,MAAO,eAAeU,GAAc,KAAK,MAAO,OAAQE,CAAuB,EAExF,SAAAZ,EAAC,OAAI,IAAKS,EAAqB,UAAU,MACtC,SAAAF,GAAkB,IAAKS,GACtBhB,EAAC,OAAyB,UAAU,OAClC,SAAAA,EAACI,EAAA,CAAK,KAAMY,EAAY,IAAK,UAAU,+CACpC,SAAAA,EAAY,MACf,GAHQA,EAAY,EAItB,CACD,EACH,EACF,CAEJ",
+  "names": ["jsx", "useEffect", "useRef", "useState", "Link", "debounce", "SupportsDropdown", "supportsMetadata", "currentNavItemRef", "supportsDropdownRef", "navItemReact", "setNavItemReact", "supportsDropdownHeight", "setSupportsDropdownHeight", "rect", "debouncedHandleResize", "supportItem"]
+}

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

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