npm - @anker-in/headless-ui - Versions diffs - 1.1.9-alpha.1764674322345 → 1.1.9-alpha.1764744576825 - Mend

@anker-in/headless-ui 1.1.9-alpha.1764674322345 → 1.1.9-alpha.1764744576825

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

Files changed (184) hide show

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

@@ -6,6 +6,11 @@ interface AiuiContextType {
     pathname?: string;
     storeDomain?: string;
     isLogin?: boolean;
+    inApp?: boolean;
+    udcGroupIds?: number[];
+    udcWhiteGroupIds?: number[];
+    targetCode?: string;
+    channel?: string;
     currencyCode?: string;
 }
 export declare const AiuiContext: React.Context<AiuiContextType>;

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

@@ -1,2 +1,2 @@
-"use strict";var p=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var A=Object.prototype.hasOwnProperty;var k=(n,e)=>{for(var o in e)p(n,o,{get:e[o],enumerable:!0})},x=(n,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!A.call(n,t)&&t!==o&&p(n,t,{get:()=>e[t],enumerable:!(s=f(e,t))||s.enumerable});return n};var C=n=>x(p({},"__esModule",{value:!0}),n);var T={};k(T,{AiuiContext:()=>c,default:()=>P,useAiuiContext:()=>_});module.exports=C(T);var h=require("react/jsx-runtime"),g=require("../../shared/track.js"),r=require("react");const c=(0,r.createContext)({trackingData:{},locale:void 0,copyWriting:{}}),_=()=>{if(!(0,r.useContext)(c))throw new Error("useAiui must be used in <AiuiProvider>");return(0,r.useContext)(c)},E=({children:n,...e})=>((0,r.useEffect)(()=>{const o=(t,a)=>{const i={};if(!a||!a.attributes)return i;for(const y of Array.from(a.attributes)){const u=y?.name;u?.startsWith("data-headless-")&&(i[u]=a.getAttribute(u))}const b=i?.["data-headless-sku"],l=i?.["data-headless-type-name"]?.split?.("#"),d=i?.["data-headless-title-desc-button"]?.split?.("#"),m=i?.["data-headless-nav-postion"]?.split?.("#");(0,g.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:e?.trackingData?.pageGroup||"Home Page",component_type:l?.[0]||"",component_name:l?.[1]||"",position:m?.[1]||"",navigation:m?.[0]||"",button_name:d?.[2]||"",SKU:b||"",component_title:d?.[0]||"",component_description:d?.[1]||""}})},s=new MutationObserver(()=>{document.querySelectorAll("[data-headless-type-name]").forEach(t=>{t.hasAttribute("data-headless-track-bound")||(t.addEventListener("click",a=>o(a,t)),t.setAttribute("data-headless-track-bound","true"))})});return s.observe(document.body,{childList:!0,subtree:!0}),document.querySelectorAll("[data-headless-type-name]").forEach(t=>{t.hasAttribute("data-headless-track-bound")||(t.addEventListener("click",a=>o(a,t)),t.setAttribute("data-headless-track-bound","true"))}),()=>s.disconnect()},[]),(0,h.jsx)(c.Provider,{value:e,children:n}));var P=E;
+"use strict";var p=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var k=(n,e)=>{for(var o in e)p(n,o,{get:e[o],enumerable:!0})},x=(n,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of f(e))!v.call(n,t)&&t!==o&&p(n,t,{get:()=>e[t],enumerable:!(s=A(e,t))||s.enumerable});return n};var C=n=>x(p({},"__esModule",{value:!0}),n);var T={};k(T,{AiuiContext:()=>c,default:()=>P,useAiuiContext:()=>_});module.exports=C(T);var b=require("react/jsx-runtime"),g=require("../../shared/track.js"),r=require("react");const c=(0,r.createContext)({trackingData:{},locale:void 0,copyWriting:{}}),_=()=>{if(!(0,r.useContext)(c))throw new Error("useAiui must be used in <AiuiProvider>");return(0,r.useContext)(c)},E=({children:n,...e})=>((0,r.useEffect)(()=>{const o=(t,a)=>{const i={};if(!a||!a.attributes)return i;for(const y of Array.from(a.attributes)){const u=y?.name;u?.startsWith("data-headless-")&&(i[u]=a.getAttribute(u))}const h=i?.["data-headless-sku"],l=i?.["data-headless-type-name"]?.split?.("#"),d=i?.["data-headless-title-desc-button"]?.split?.("#"),m=i?.["data-headless-nav-postion"]?.split?.("#");(0,g.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:e?.trackingData?.pageGroup||"Home Page",component_type:l?.[0]||"",component_name:l?.[1]||"",position:m?.[1]||"",navigation:m?.[0]||"",button_name:d?.[2]||"",SKU:h||"",component_title:d?.[0]||"",component_description:d?.[1]||""}})},s=new MutationObserver(()=>{document.querySelectorAll("[data-headless-type-name]").forEach(t=>{t.hasAttribute("data-headless-track-bound")||(t.addEventListener("click",a=>o(a,t)),t.setAttribute("data-headless-track-bound","true"))})});return s.observe(document.body,{childList:!0,subtree:!0}),document.querySelectorAll("[data-headless-type-name]").forEach(t=>{t.hasAttribute("data-headless-track-bound")||(t.addEventListener("click",a=>o(a,t)),t.setAttribute("data-headless-track-bound","true"))}),()=>s.disconnect()},[]),(0,b.jsx)(c.Provider,{value:e,children:n}));var P=E;
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/AiuiProvider/index.tsx"],
-  "sourcesContent": ["import { gaTrack } from '../../shared/track.js'\nimport React, { createContext, useContext, useEffect } from 'react'\n\ninterface AiuiContextType {\n  trackingData: Record<string, any>\n  locale?: string\n  copyWriting?: Record<string, string>\n  pathname?: string\n  storeDomain?: string\n  isLogin?: boolean\n  currencyCode?: string\n}\n\nexport const AiuiContext = createContext<AiuiContextType>({\n  trackingData: {},\n  locale: undefined,\n  copyWriting: {},\n})\n\nexport const useAiuiContext = () => {\n  const context = useContext(AiuiContext)\n  if (!context) {\n    throw new Error('useAiui must be used in <AiuiProvider>')\n  }\n  return useContext(AiuiContext)\n}\n\nconst AiuiProvider = ({\n  children,\n  ...rest\n}: {\n  children: React.ReactNode\n} & AiuiContextType) => {\n  useEffect(() => {\n    const handleTrackClick = (e: any, el: any) => {\n      // e?.stopPropagation?.()\n      const out: any = {}\n      if (!el || !el.attributes) return out\n      for (const attr of Array.from(el.attributes)) {\n        const name = (attr as any)?.name\n        if (name?.startsWith('data-headless-')) {\n          out[name] = el.getAttribute(name)\n        }\n      }\n      const sku = out?.['data-headless-sku']\n      const nameType = out?.['data-headless-type-name']?.split?.('#')\n      const titleDesc = out?.['data-headless-title-desc-button']?.split?.('#')\n      const navPosition = out?.['data-headless-nav-postion']?.split?.('#')\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'component_click',\n        event_parameters: {\n          page_group: rest?.trackingData?.pageGroup || 'Home Page',\n          component_type: nameType?.[0] || '',\n          component_name: nameType?.[1] || '',\n          position: navPosition?.[1] || '',\n          navigation: navPosition?.[0] || '',\n          button_name: titleDesc?.[2] || '',\n          SKU: sku || '',\n          component_title: titleDesc?.[0] || '',\n          component_description: titleDesc?.[1] || '',\n        },\n      })\n    }\n    const observer = new MutationObserver(() => {\n      document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n        if (!el.hasAttribute('data-headless-track-bound')) {\n          el.addEventListener('click', e => handleTrackClick(e, el))\n          el.setAttribute('data-headless-track-bound', 'true') // \u907F\u514D\u91CD\u590D\u7ED1\u5B9A\n        }\n      })\n    })\n    observer.observe(document.body, { childList: true, subtree: true })\n    // \u521D\u59CB\u5316\u4E00\u6B21\u73B0\u6709\u8282\u70B9\n    document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n      if (!el.hasAttribute('data-headless-track-bound')) {\n        el.addEventListener('click', e => handleTrackClick(e, el))\n        el.setAttribute('data-headless-track-bound', 'true')\n      }\n    })\n    return () => observer.disconnect()\n  }, [])\n\n  return <AiuiContext.Provider value={rest}>{children}</AiuiContext.Provider>\n}\n\nexport default AiuiProvider\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,EAAA,YAAAC,EAAA,mBAAAC,IAAA,eAAAC,EAAAL,GAmFS,IAAAM,EAAA,6BAnFTC,EAAwB,iCACxBC,EAA4D,iBAYrD,MAAMN,KAAc,iBAA+B,CACxD,aAAc,CAAC,EACf,OAAQ,OACR,YAAa,CAAC,CAChB,CAAC,EAEYE,EAAiB,IAAM,CAElC,GAAI,IADY,cAAWF,CAAW,EAEpC,MAAM,IAAI,MAAM,wCAAwC,EAE1D,SAAO,cAAWA,CAAW,CAC/B,EAEMO,EAAe,CAAC,CACpB,SAAAC,EACA,GAAGC,CACL,QAGE,aAAU,IAAM,CACd,MAAMC,EAAmB,CAACC,EAAQC,IAAY,CAE5C,MAAMC,EAAW,CAAC,EAClB,GAAI,CAACD,GAAM,CAACA,EAAG,WAAY,OAAOC,EAClC,UAAWC,KAAQ,MAAM,KAAKF,EAAG,UAAU,EAAG,CAC5C,MAAMG,EAAQD,GAAc,KACxBC,GAAM,WAAW,gBAAgB,IACnCF,EAAIE,CAAI,EAAIH,EAAG,aAAaG,CAAI,EAEpC,CACA,MAAMC,EAAMH,IAAM,mBAAmB,EAC/BI,EAAWJ,IAAM,yBAAyB,GAAG,QAAQ,GAAG,EACxDK,EAAYL,IAAM,iCAAiC,GAAG,QAAQ,GAAG,EACjEM,EAAcN,IAAM,2BAA2B,GAAG,QAAQ,GAAG,KACnE,WAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,WAAYJ,GAAM,cAAc,WAAa,YAC7C,eAAgBQ,IAAW,CAAC,GAAK,GACjC,eAAgBA,IAAW,CAAC,GAAK,GACjC,SAAUE,IAAc,CAAC,GAAK,GAC9B,WAAYA,IAAc,CAAC,GAAK,GAChC,YAAaD,IAAY,CAAC,GAAK,GAC/B,IAAKF,GAAO,GACZ,gBAAiBE,IAAY,CAAC,GAAK,GACnC,sBAAuBA,IAAY,CAAC,GAAK,EAC3C,CACF,CAAC,CACH,EACME,EAAW,IAAI,iBAAiB,IAAM,CAC1C,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAASD,GAAKD,EAAiBC,EAAGC,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,CACH,CAAC,EACD,OAAAQ,EAAS,QAAQ,SAAS,KAAM,CAAE,UAAW,GAAM,QAAS,EAAK,CAAC,EAElE,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAASD,GAAKD,EAAiBC,EAAGC,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,EACM,IAAMQ,EAAS,WAAW,CACnC,EAAG,CAAC,CAAC,KAEE,OAACpB,EAAY,SAAZ,CAAqB,MAAOS,EAAO,SAAAD,EAAS,GAGtD,IAAOP,EAAQM",
+  "sourcesContent": ["import { gaTrack } from '../../shared/track.js'\nimport React, { createContext, useContext, useEffect } from 'react'\n\ninterface AiuiContextType {\n  trackingData: Record<string, any>\n  locale?: string\n  copyWriting?: Record<string, string>\n  pathname?: string\n  storeDomain?: string\n  isLogin?: boolean\n  inApp?: boolean\n  udcGroupIds?: number[]\n  udcWhiteGroupIds?: number[]\n  targetCode?: string\n  channel?: string\n  currencyCode?: string\n}\n\nexport const AiuiContext = createContext<AiuiContextType>({\n  trackingData: {},\n  locale: undefined,\n  copyWriting: {},\n})\n\nexport const useAiuiContext = () => {\n  const context = useContext(AiuiContext)\n  if (!context) {\n    throw new Error('useAiui must be used in <AiuiProvider>')\n  }\n  return useContext(AiuiContext)\n}\n\nconst AiuiProvider = ({\n  children,\n  ...rest\n}: {\n  children: React.ReactNode\n} & AiuiContextType) => {\n  useEffect(() => {\n    const handleTrackClick = (e: any, el: any) => {\n      // e?.stopPropagation?.()\n      const out: any = {}\n      if (!el || !el.attributes) return out\n      for (const attr of Array.from(el.attributes)) {\n        const name = (attr as any)?.name\n        if (name?.startsWith('data-headless-')) {\n          out[name] = el.getAttribute(name)\n        }\n      }\n      const sku = out?.['data-headless-sku']\n      const nameType = out?.['data-headless-type-name']?.split?.('#')\n      const titleDesc = out?.['data-headless-title-desc-button']?.split?.('#')\n      const navPosition = out?.['data-headless-nav-postion']?.split?.('#')\n      gaTrack({\n        event: 'ga4Event',\n        event_name: 'component_click',\n        event_parameters: {\n          page_group: rest?.trackingData?.pageGroup || 'Home Page',\n          component_type: nameType?.[0] || '',\n          component_name: nameType?.[1] || '',\n          position: navPosition?.[1] || '',\n          navigation: navPosition?.[0] || '',\n          button_name: titleDesc?.[2] || '',\n          SKU: sku || '',\n          component_title: titleDesc?.[0] || '',\n          component_description: titleDesc?.[1] || '',\n        },\n      })\n    }\n    const observer = new MutationObserver(() => {\n      document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n        if (!el.hasAttribute('data-headless-track-bound')) {\n          el.addEventListener('click', e => handleTrackClick(e, el))\n          el.setAttribute('data-headless-track-bound', 'true') // \u907F\u514D\u91CD\u590D\u7ED1\u5B9A\n        }\n      })\n    })\n    observer.observe(document.body, { childList: true, subtree: true })\n    // \u521D\u59CB\u5316\u4E00\u6B21\u73B0\u6709\u8282\u70B9\n    document.querySelectorAll('[data-headless-type-name]').forEach(el => {\n      if (!el.hasAttribute('data-headless-track-bound')) {\n        el.addEventListener('click', e => handleTrackClick(e, el))\n        el.setAttribute('data-headless-track-bound', 'true')\n      }\n    })\n    return () => observer.disconnect()\n  }, [])\n\n  return <AiuiContext.Provider value={rest}>{children}</AiuiContext.Provider>\n}\n\nexport default AiuiProvider\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,EAAA,YAAAC,EAAA,mBAAAC,IAAA,eAAAC,EAAAL,GAwFS,IAAAM,EAAA,6BAxFTC,EAAwB,iCACxBC,EAA4D,iBAiBrD,MAAMN,KAAc,iBAA+B,CACxD,aAAc,CAAC,EACf,OAAQ,OACR,YAAa,CAAC,CAChB,CAAC,EAEYE,EAAiB,IAAM,CAElC,GAAI,IADY,cAAWF,CAAW,EAEpC,MAAM,IAAI,MAAM,wCAAwC,EAE1D,SAAO,cAAWA,CAAW,CAC/B,EAEMO,EAAe,CAAC,CACpB,SAAAC,EACA,GAAGC,CACL,QAGE,aAAU,IAAM,CACd,MAAMC,EAAmB,CAACC,EAAQC,IAAY,CAE5C,MAAMC,EAAW,CAAC,EAClB,GAAI,CAACD,GAAM,CAACA,EAAG,WAAY,OAAOC,EAClC,UAAWC,KAAQ,MAAM,KAAKF,EAAG,UAAU,EAAG,CAC5C,MAAMG,EAAQD,GAAc,KACxBC,GAAM,WAAW,gBAAgB,IACnCF,EAAIE,CAAI,EAAIH,EAAG,aAAaG,CAAI,EAEpC,CACA,MAAMC,EAAMH,IAAM,mBAAmB,EAC/BI,EAAWJ,IAAM,yBAAyB,GAAG,QAAQ,GAAG,EACxDK,EAAYL,IAAM,iCAAiC,GAAG,QAAQ,GAAG,EACjEM,EAAcN,IAAM,2BAA2B,GAAG,QAAQ,GAAG,KACnE,WAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,WAAYJ,GAAM,cAAc,WAAa,YAC7C,eAAgBQ,IAAW,CAAC,GAAK,GACjC,eAAgBA,IAAW,CAAC,GAAK,GACjC,SAAUE,IAAc,CAAC,GAAK,GAC9B,WAAYA,IAAc,CAAC,GAAK,GAChC,YAAaD,IAAY,CAAC,GAAK,GAC/B,IAAKF,GAAO,GACZ,gBAAiBE,IAAY,CAAC,GAAK,GACnC,sBAAuBA,IAAY,CAAC,GAAK,EAC3C,CACF,CAAC,CACH,EACME,EAAW,IAAI,iBAAiB,IAAM,CAC1C,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAASD,GAAKD,EAAiBC,EAAGC,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,CACH,CAAC,EACD,OAAAQ,EAAS,QAAQ,SAAS,KAAM,CAAE,UAAW,GAAM,QAAS,EAAK,CAAC,EAElE,SAAS,iBAAiB,2BAA2B,EAAE,QAAQR,GAAM,CAC9DA,EAAG,aAAa,2BAA2B,IAC9CA,EAAG,iBAAiB,QAASD,GAAKD,EAAiBC,EAAGC,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,EACM,IAAMQ,EAAS,WAAW,CACnC,EAAG,CAAC,CAAC,KAEE,OAACpB,EAAY,SAAZ,CAAqB,MAAOS,EAAO,SAAAD,EAAS,GAGtD,IAAOP,EAAQM",
   "names": ["AiuiProvider_exports", "__export", "AiuiContext", "AiuiProvider_default", "useAiuiContext", "__toCommonJS", "import_jsx_runtime", "import_track", "import_react", "AiuiProvider", "children", "rest", "handleTrackClick", "e", "el", "out", "attr", "name", "sku", "nameType", "titleDesc", "navPosition", "observer"]
 }

package/dist/cjs/biz-components/Category/SwiperCategory.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";"use client";var m=Object.create;var a=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var S=Object.getOwnPropertyNames;var g=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var M=(e,i)=>{for(var r in i)a(e,r,{get:i[r],enumerable:!0})},d=(e,i,r,l)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of S(i))!P.call(e,o)&&o!==r&&a(e,o,{get:()=>i[o],enumerable:!(l=u(i,o))||l.enumerable});return e};var y=(e,i,r)=>(r=e!=null?m(g(e)):{},d(i||!e||!e.__esModule?a(r,"default",{value:e,enumerable:!0}):r,e)),B=e=>d(a({},"__esModule",{value:!0}),e);var b={};M(b,{default:()=>h});module.exports=B(b);var t=require("react/jsx-runtime"),c=y(require("react")),n=require("swiper/react"),s=require("swiper/modules"),k=require("swiper/css"),G=require("swiper/css/pagination");const f=c.default.forwardRef(({data:e,Slide:i,id:r,pagination:l},o)=>(0,t.jsx)(n.Swiper,{freeMode:!0,mousewheel:{forceToAxis:!0},pagination:{clickable:!0,dynamicBullets:!1},className:"!overflow-visible",modules:[s.FreeMode,s.Mousewheel,s.Pagination],breakpoints:{0:{spaceBetween:16,freeMode:!1,slidesPerView:1,slidesPerGroup:1},376:{spaceBetween:16,freeMode:!1,slidesPerView:1,slidesPerGroup:1},767:{spaceBetween:16,freeMode:!1,slidesPerView:4,slidesPerGroup:4},1441:{spaceBetween:16,freeMode:!1,slidesPerView:Math.min(6,e?.list?.length),slidesPerGroup:Math.min(6,e?.list?.length)}},children:e?.list?.map((w,p)=>(0,t.jsx)(n.SwiperSlide,{className:"!h-[unset]",children:(0,t.jsx)(i,{data:w,configuration:{...e?.configuration,index:p}})},r+"SwiperSlide"+p))}));f.displayName="SwiperBox";var h=f;
+"use strict";"use client";var m=Object.create;var a=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var S=Object.getOwnPropertyNames;var g=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var M=(e,i)=>{for(var r in i)a(e,r,{get:i[r],enumerable:!0})},d=(e,i,r,l)=>{if(i&&typeof i=="object"||typeof i=="function")for(let o of S(i))!P.call(e,o)&&o!==r&&a(e,o,{get:()=>i[o],enumerable:!(l=u(i,o))||l.enumerable});return e};var y=(e,i,r)=>(r=e!=null?m(g(e)):{},d(i||!e||!e.__esModule?a(r,"default",{value:e,enumerable:!0}):r,e)),B=e=>d(a({},"__esModule",{value:!0}),e);var b={};M(b,{default:()=>h});module.exports=B(b);var t=require("react/jsx-runtime"),c=y(require("react")),n=require("swiper/react"),s=require("swiper/modules"),k=require("swiper/css"),G=require("swiper/css/pagination");const f=c.default.forwardRef(({data:e,Slide:i,id:r,pagination:l},o)=>(0,t.jsx)(n.Swiper,{freeMode:!0,mousewheel:{forceToAxis:!0},pagination:{clickable:!0,dynamicBullets:!1},className:"!overflow-visible",modules:[s.FreeMode,s.Mousewheel,s.Pagination],breakpoints:{0:{spaceBetween:16,freeMode:!1,slidesPerView:2,slidesPerGroup:1},376:{spaceBetween:16,freeMode:!1,slidesPerView:2,slidesPerGroup:1},767:{spaceBetween:16,freeMode:!1,slidesPerView:4,slidesPerGroup:4},1441:{spaceBetween:16,freeMode:!1,slidesPerView:Math.min(6,e?.list?.length),slidesPerGroup:Math.min(6,e?.list?.length)}},children:e?.list?.map((w,p)=>(0,t.jsx)(n.SwiperSlide,{className:"!h-[unset]",children:(0,t.jsx)(i,{data:w,configuration:{...e?.configuration,index:p}})},r+"SwiperSlide"+p))}));f.displayName="SwiperBox";var h=f;
 //# sourceMappingURL=SwiperCategory.js.map

package/dist/cjs/biz-components/Category/SwiperCategory.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Category/SwiperCategory.tsx"],
-  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Pagination, FreeMode, Mousewheel } from 'swiper/modules'\nimport 'swiper/css'\nimport 'swiper/css/pagination' // \u5206\u9875\u5668\u6837\u5F0F\n\nexport interface SwiperBoxProps {\n  data: {\n    list: any[]\n    configuration?: any\n  }\n  pagination?: any\n  id: string\n  className?: string\n  breakpoints?: Record<number, Object>\n  Slide: React.ComponentType<{ data: any; configuration?: any }>\n}\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(({ data, Slide, id, pagination }, ref) => {\n  return (\n    <Swiper\n      freeMode={true}\n      mousewheel={{\n        forceToAxis: true,\n      }}\n      pagination={{\n        clickable: true,\n        dynamicBullets: false,\n      }}\n      className=\"!overflow-visible\"\n      modules={[FreeMode, Mousewheel, Pagination]}\n      breakpoints={{\n        0: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: 1,\n          slidesPerGroup: 1,\n        },\n        376: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: 1,\n          slidesPerGroup: 1,\n        },\n        767: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: 4,\n          slidesPerGroup: 4,\n        },\n        1441: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: Math.min(6, data?.list?.length),\n          slidesPerGroup: Math.min(6, data?.list?.length),\n        },\n      }}\n    >\n      {data?.list?.map((item, jIndex) => (\n        <SwiperSlide key={id + 'SwiperSlide' + jIndex} className=\"!h-[unset]\">\n          <Slide data={item} configuration={{ ...data?.configuration, index: jIndex }} />\n        </SwiperSlide>\n      ))}\n    </Swiper>\n  )\n})\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
+  "sourcesContent": ["'use client'\nimport React from 'react'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Pagination, FreeMode, Mousewheel } from 'swiper/modules'\nimport 'swiper/css'\nimport 'swiper/css/pagination' // \u5206\u9875\u5668\u6837\u5F0F\n\nexport interface SwiperBoxProps {\n  data: {\n    list: any[]\n    configuration?: any\n  }\n  pagination?: any\n  id: string\n  className?: string\n  breakpoints?: Record<number, Object>\n  Slide: React.ComponentType<{ data: any; configuration?: any }>\n}\n\nconst SwiperBox = React.forwardRef<HTMLDivElement, SwiperBoxProps>(({ data, Slide, id, pagination }, ref) => {\n  return (\n    <Swiper\n      freeMode={true}\n      mousewheel={{\n        forceToAxis: true,\n      }}\n      pagination={{\n        clickable: true,\n        dynamicBullets: false,\n      }}\n      className=\"!overflow-visible\"\n      modules={[FreeMode, Mousewheel, Pagination]}\n      breakpoints={{\n        0: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: 2,\n          slidesPerGroup: 1,\n        },\n        376: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: 2,\n          slidesPerGroup: 1,\n        },\n        767: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: 4,\n          slidesPerGroup: 4,\n        },\n        1441: {\n          spaceBetween: 16,\n          freeMode: false,\n          slidesPerView: Math.min(6, data?.list?.length),\n          slidesPerGroup: Math.min(6, data?.list?.length),\n        },\n      }}\n    >\n      {data?.list?.map((item, jIndex) => (\n        <SwiperSlide key={id + 'SwiperSlide' + jIndex} className=\"!h-[unset]\">\n          <Slide data={item} configuration={{ ...data?.configuration, index: jIndex }} />\n        </SwiperSlide>\n      ))}\n    </Swiper>\n  )\n})\n\nSwiperBox.displayName = 'SwiperBox'\n\nexport default SwiperBox\n"],
   "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6DU,IAAAI,EAAA,6BA5DVC,EAAkB,oBAClBA,EAAoC,wBACpCC,EAAiD,0BACjDC,EAAO,sBACPC,EAAO,iCAcP,MAAMC,EAAY,EAAAC,QAAM,WAA2C,CAAC,CAAE,KAAAC,EAAM,MAAAC,EAAO,GAAAC,EAAI,WAAAC,CAAW,EAAGC,OAEjG,OAAC,UACC,SAAU,GACV,WAAY,CACV,YAAa,EACf,EACA,WAAY,CACV,UAAW,GACX,eAAgB,EAClB,EACA,UAAU,oBACV,QAAS,CAAC,WAAU,aAAY,YAAU,EAC1C,YAAa,CACX,EAAG,CACD,aAAc,GACd,SAAU,GACV,cAAe,EACf,eAAgB,CAClB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,EACf,eAAgB,CAClB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,EACf,eAAgB,CAClB,EACA,KAAM,CACJ,aAAc,GACd,SAAU,GACV,cAAe,KAAK,IAAI,EAAGJ,GAAM,MAAM,MAAM,EAC7C,eAAgB,KAAK,IAAI,EAAGA,GAAM,MAAM,MAAM,CAChD,CACF,EAEC,SAAAA,GAAM,MAAM,IAAI,CAACK,EAAMC,OACtB,OAAC,eAA8C,UAAU,aACvD,mBAACL,EAAA,CAAM,KAAMI,EAAM,cAAe,CAAE,GAAGL,GAAM,cAAe,MAAOM,CAAO,EAAG,GAD7DJ,EAAK,cAAgBI,CAEvC,CACD,EACH,CAEH,EAEDR,EAAU,YAAc,YAExB,IAAOP,EAAQO",
   "names": ["SwiperCategory_exports", "__export", "SwiperCategory_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_modules", "import_css", "import_pagination", "SwiperBox", "React", "data", "Slide", "id", "pagination", "ref", "item", "jIndex"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var C=Object.create;var d=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var I=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,D=Object.prototype.hasOwnProperty;var T=(e,t)=>{for(var o in t)d(e,o,{get:t[o],enumerable:!0})},v=(e,t,o,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of I(t))!D.call(e,n)&&n!==o&&d(e,n,{get:()=>t[n],enumerable:!(r=N(t,n))||r.enumerable});return e};var u=(e,t,o)=>(o=e!=null?C($(e)):{},v(t||!e||!e.__esModule?d(o,"default",{value:e,enumerable:!0}):o,e)),_=e=>v(d({},"__esModule",{value:!0}),e);var z={};T(z,{default:()=>E});module.exports=_(z);var a=require("react/jsx-runtime"),s=u(require("react")),i=require("../../helpers/utils.js"),g=u(require("../../components/picture.js")),b=require("../../shared/Styles.js"),k=u(require("../Title/index.js")),x=u(require("./SwiperCategory.js")),h=require("../../hooks/useExposure.js"),f=require("../../shared/trackUrlRef.js"),w=require("../../components/heading.js");const m="image",p="category_banner",H=(e,t)=>{const o=[];for(let r=0;r<e.length;r+=t)o.push(e.slice(r,r+t));return o},S=({data:e,configuration:t})=>{const o=(0,s.useRef)(null);return(0,h.useExposure)(o,{componentType:m,componentName:p,componentTitle:e?.name,position:t?.index+1}),(0,a.jsxs)("div",{ref:o,className:(0,i.cn)("tablet:h-[120px] laptop:h-[144px] desktop:h-[192px] lg-desktop:h-[240px]","tablet:p-3 laptop:p-4 desktop:p-6 lg-desktop:p-8","bg-container-secondary-1 hover:bg-info-white group box-border flex size-full cursor-pointer flex-col overflow-hidden duration-300",t?.shape==="round"?"rounded-2xl":"rounded-none"),children:[(0,a.jsx)("div",{className:"transition-all duration-300 group-hover:scale-110",children:(0,a.jsx)("a",{"aria-label":e?.name,href:(0,f.trackUrlRef)(e?.link,`${m}_${p}`),"data-headless-type-name":`${m}#${p}`,"data-headless-title-desc-button":`${e?.name}`,onClick:()=>t?.event?.primaryButton(e,t?.index),children:(0,a.jsx)(g.default,{alt:e?.image?.alt||"",source:e?.image?.url||"",className:"laptop:size-[88px] tablet:size-[72px] desktop:size-[116px] lg-desktop:size-[146px] m-auto flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover"})})}),(0,a.jsx)(w.Heading,{as:"h3",className:"lg-desktop:text-[18px] text-info-primary box-border line-clamp-2 flex-1 text-center text-[14px] font-bold",children:e?.name})]})},j=({data:e,configuration:t,index:o,totalCount:r})=>{const n=(0,s.useRef)(null);(0,h.useExposure)(n,{componentType:m,componentName:p,componentTitle:e?.name,position:t?.index+1});const l=r<6,c=o===0;return(0,a.jsxs)("div",{ref:n,className:(0,i.cn)("bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden","hover:bg-info-white cursor-pointer duration-300",l?(0,i.cn)("p-4",c?"aspect-h-[252] row-span-2":"aspect-h-[120]"):"max-h-[126px] px-3 py-4",t?.shape==="round"?"rounded-2xl":"rounded-none"),children:[(0,a.jsx)("a",{href:(0,f.trackUrlRef)(e?.link,`${m}_${p}`),"data-headless-type-name":`${m}#${p}`,"data-headless-title-desc-button":`${e?.name}`,"data-headless-nav-postion":`''#${t?.index+1}`,onClick:()=>t?.event?.primaryButton(e,t?.index+1),children:(0,a.jsx)(g.default,{source:e?.image?.url||"",alt:e?.image?.alt||"",className:(0,i.cn)("m-auto mb-2 flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",l?(0,i.cn)(c?"max-h-[146px] overflow-hidden":"max-h-[72px] max-w-[72px]"):"size-[72px]")})}),(0,a.jsx)("p",{className:(0,i.cn)("text-info-primary text-center text-sm font-bold",l?"line-clamp-2":"shrink-0 truncate"),children:e?.name})]})},L=({data:e,configuration:t})=>(0,a.jsx)("div",{className:"grid grid-cols-2 gap-3",children:e?.map((o,r)=>(0,a.jsx)(j,{index:r,data:o,configuration:t,totalCount:e?.length},r))}),M=s.default.forwardRef((e,t)=>{const{data:o,className:r="",key:n,event:l}=e,c=o?.isShowSelect?o?.products:o?.productData,y=(0,s.useRef)(null);return(0,s.useImperativeHandle)(t,()=>y.current),(0,a.jsxs)("div",{ref:y,className:(0,i.cn)("w-full overflow-hidden",r,{"aiui-dark":o?.theme==="dark"}),children:[o?.title&&(0,a.jsx)(k.default,{data:{title:o?.title},className:"text-4xl"}),(0,a.jsx)("div",{className:"tablet:block hidden",children:(0,a.jsx)(x.default,{id:`Category${n}`,Slide:S,data:{list:c,configuration:{shape:o?.shape,event:l,title:o?.title}}})}),(0,a.jsx)("div",{className:"tablet:hidden block",children:(0,a.jsx)(x.default,{id:`Category1${n}`,Slide:L,data:{list:H(c,6),configuration:{shape:o?.shape,event:l,title:o?.title}}})}),(0,a.jsx)("div",{className:"h-7"})]})});var E=(0,b.withLayout)(M);
+"use strict";"use client";var I=Object.create;var d=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,T=Object.prototype.hasOwnProperty;var _=(e,t)=>{for(var o in t)d(e,o,{get:t[o],enumerable:!0})},b=(e,t,o,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of D(t))!T.call(e,n)&&n!==o&&d(e,n,{get:()=>t[n],enumerable:!(r=$(t,n))||r.enumerable});return e};var u=(e,t,o)=>(o=e!=null?I(S(e)):{},b(t||!e||!e.__esModule?d(o,"default",{value:e,enumerable:!0}):o,e)),H=e=>b(d({},"__esModule",{value:!0}),e);var B={};_(B,{default:()=>R});module.exports=H(B);var a=require("react/jsx-runtime"),l=u(require("react")),i=require("../../helpers/utils.js"),g=u(require("../../components/picture.js")),k=require("../../shared/Styles.js"),C=u(require("../Title/index.js")),x=u(require("./SwiperCategory.js")),f=require("../../hooks/useExposure.js"),h=require("../../shared/trackUrlRef.js"),w=require("../../components/heading.js");const p="image",c="category_banner",j=(e,t)=>{const o=[];for(let r=0;r<e.length;r+=t)o.push(e.slice(r,r+t));return o},L=({data:e,configuration:t})=>{const o=(0,l.useRef)(null);return(0,f.useExposure)(o,{componentType:p,componentName:c,componentTitle:e?.name,position:t?.index+1}),(0,a.jsxs)("div",{ref:o,className:(0,i.cn)("tablet:h-[120px] laptop:h-[144px] desktop:h-[192px] lg-desktop:h-[240px]","tablet:p-3 laptop:p-4 desktop:p-6 lg-desktop:p-8","bg-container-secondary-1 hover:bg-info-white group box-border flex size-full cursor-pointer flex-col overflow-hidden duration-300",t?.shape==="round"?"rounded-2xl":"rounded-none"),children:[(0,a.jsx)("div",{className:"transition-all duration-300 group-hover:scale-110",children:(0,a.jsx)("a",{"aria-label":e?.name,href:(0,h.trackUrlRef)(e?.link,`${p}_${c}`),"data-headless-type-name":`${p}#${c}`,"data-headless-title-desc-button":`${e?.name}`,onClick:()=>t?.event?.primaryButton(e,t?.index),children:(0,a.jsx)(g.default,{alt:e?.image?.alt||"",source:e?.image?.url||"",className:"laptop:size-[88px] tablet:size-[72px] desktop:size-[116px] lg-desktop:size-[146px] m-auto flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover"})})}),(0,a.jsx)(w.Heading,{as:"h3",className:"lg-desktop:text-[18px] text-info-primary box-border line-clamp-2 flex-1 text-center text-[14px] font-bold",children:e?.name})]})},M=({data:e,configuration:t,index:o})=>{const r=(0,l.useRef)(null);(0,f.useExposure)(r,{componentType:p,componentName:c,componentTitle:e?.name,position:t?.index+1});const s=(t?.totalCategories??0)<6,m=o===0;return(0,a.jsxs)("div",{ref:r,className:(0,i.cn)("bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden","hover:bg-info-white cursor-pointer duration-300",s?(0,i.cn)("p-4",m?"aspect-h-[252] row-span-2":"aspect-h-[120]"):"max-h-[126px] px-3 py-4",t?.shape==="round"?"rounded-2xl":"rounded-none"),children:[(0,a.jsx)("a",{href:(0,h.trackUrlRef)(e?.link,`${p}_${c}`),"data-headless-type-name":`${p}#${c}`,"data-headless-title-desc-button":`${e?.name}`,"data-headless-nav-postion":`''#${t?.index+1}`,onClick:()=>t?.event?.primaryButton(e,t?.index+1),children:(0,a.jsx)(g.default,{source:e?.image?.url||"",alt:e?.image?.alt||"",className:(0,i.cn)("m-auto mb-2 flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover",s?(0,i.cn)(m?"max-h-[146px] overflow-hidden":"max-h-[72px] max-w-[72px]"):"size-[72px]")})}),(0,a.jsx)("p",{className:(0,i.cn)("text-info-primary text-center text-sm font-bold",s?"line-clamp-2":"shrink-0 truncate"),children:e?.name})]})},E=({data:e,configuration:t})=>(0,a.jsx)("div",{className:"flex h-full flex-col gap-3",children:e?.map((o,r)=>(0,a.jsx)(M,{index:r,data:o,configuration:t},r))}),z=l.default.forwardRef((e,t)=>{const{data:o,className:r="",key:n,event:s}=e,m=(o?.isShowSelect?o?.products:o?.productData)||[],y=m.length,N=j(m,3),v=(0,l.useRef)(null);return(0,l.useImperativeHandle)(t,()=>v.current),(0,a.jsxs)("div",{ref:v,className:(0,i.cn)("w-full overflow-hidden",r,{"aiui-dark":o?.theme==="dark"}),children:[o?.title&&(0,a.jsx)(C.default,{data:{title:o?.title},className:"text-4xl"}),(0,a.jsx)("div",{className:"tablet:block hidden",children:(0,a.jsx)(x.default,{id:`Category${n}`,Slide:L,data:{list:m,configuration:{shape:o?.shape,event:s,title:o?.title,totalCategories:y}}})}),(0,a.jsx)("div",{className:"tablet:hidden block",children:(0,a.jsx)(x.default,{id:`Category1${n}`,Slide:E,data:{list:N,configuration:{shape:o?.shape,event:s,title:o?.title,totalCategories:y}}})}),(0,a.jsx)("div",{className:"h-7"})]})});var R=(0,k.withLayout)(z);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/Category/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from './SwiperCategory.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { Img } from '../../types/props.js'\nimport { Heading } from '../../components/heading.js'\n\nconst componentType = 'image'\nconst componentName = 'category_banner'\n\nexport interface CategoryItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  image: Img\n  name: string\n  link?: string\n}\n\nexport interface CategoryProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  data: {\n    isShowSelect: boolean\n    products: CategoryItem[]\n    productData: CategoryItem[]\n    /** \u5361\u7247\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    title?: string\n    theme?: 'light' | 'dark'\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n  key?: string\n}\n\nconst chunkArray = (arr: any[], size: number) => {\n  const chunks = []\n  for (let i = 0; i < arr.length; i += size) {\n    chunks.push(arr.slice(i, i + size))\n  }\n  return chunks\n}\n\nconst CategoryPcItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.name,\n    position: configuration?.index + 1,\n  })\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'tablet:h-[120px] laptop:h-[144px] desktop:h-[192px] lg-desktop:h-[240px]',\n        'tablet:p-3 laptop:p-4 desktop:p-6 lg-desktop:p-8',\n        'bg-container-secondary-1 hover:bg-info-white group box-border flex size-full cursor-pointer flex-col overflow-hidden duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className=\"transition-all duration-300 group-hover:scale-110\">\n        <a\n          aria-label={data?.name}\n          href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}\n          data-headless-type-name={`${componentType}#${componentName}`}\n          data-headless-title-desc-button={`${data?.name}`}\n          onClick={() => configuration?.event?.primaryButton(data, configuration?.index)}\n        >\n          <Picture\n            alt={data?.image?.alt || ''}\n            source={data?.image?.url || ''}\n            className=\"laptop:size-[88px] tablet:size-[72px] desktop:size-[116px] lg-desktop:size-[146px] m-auto flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n          />\n        </a>\n      </div>\n      <Heading\n        as=\"h3\"\n        className=\"lg-desktop:text-[18px] text-info-primary box-border line-clamp-2 flex-1 text-center text-[14px] font-bold\"\n      >\n        {data?.name}\n      </Heading>\n    </div>\n  )\n}\n\n// \u79FB\u52A8\u7AEF\u54C1\u7C7B\u5C55\u793A\u7EC4\u4EF6\nconst SingleMobileItem = ({\n  data,\n  configuration,\n  index,\n  totalCount,\n}: {\n  data: CategoryItem\n  configuration?: any\n  index: number\n  totalCount: number\n}) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.name,\n    position: configuration?.index + 1,\n  })\n\n  // \u5F53\u6570\u91CF\u5C11\u4E8E\u5BB9\u5668\u65F6\uFF0C\u7B2C\u4E00\u4E2A\u9879\u76EE\u4F1A\u5360\u636E\u66F4\u5927\u7A7A\u95F4\n  const isFirstItemLarger = totalCount < 6\n  const isFirstItem = index === 0\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden',\n        'hover:bg-info-white cursor-pointer duration-300',\n        // \u5F53\u7B2C\u4E00\u4E2A\u9879\u76EE\u9700\u8981\u66F4\u5927\u7A7A\u95F4\u65F6\u8C03\u6574\u6837\u5F0F\n        isFirstItemLarger\n          ? cn('p-4', isFirstItem ? 'aspect-h-[252] row-span-2' : 'aspect-h-[120]')\n          : 'max-h-[126px] px-3 py-4',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <a\n        href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}\n        data-headless-type-name={`${componentType}#${componentName}`}\n        data-headless-title-desc-button={`${data?.name}`}\n        data-headless-nav-postion={`''#${configuration?.index + 1}`}\n        onClick={() => configuration?.event?.primaryButton(data, configuration?.index + 1)}\n      >\n        <Picture\n          source={data?.image?.url || ''}\n          alt={data?.image?.alt || ''}\n          className={cn(\n            'm-auto mb-2 flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover',\n            // \u5F53\u7B2C\u4E00\u4E2A\u9879\u76EE\u9700\u8981\u66F4\u5927\u7A7A\u95F4\u65F6\u8C03\u6574\u56FE\u7247\u5C3A\u5BF8\n            isFirstItemLarger\n              ? cn(isFirstItem ? 'max-h-[146px] overflow-hidden' : 'max-h-[72px] max-w-[72px]')\n              : 'size-[72px]'\n          )}\n        />\n      </a>\n      <p\n        className={cn(\n          'text-info-primary text-center text-sm font-bold',\n          // \u5F53\u7B2C\u4E00\u4E2A\u9879\u76EE\u9700\u8981\u66F4\u5927\u7A7A\u95F4\u65F6\u8C03\u6574\u6587\u5B57\u663E\u793A\n          isFirstItemLarger ? 'line-clamp-2' : 'shrink-0 truncate'\n        )}\n      >\n        {data?.name}\n      </p>\n    </div>\n  )\n}\n\n// \u79FB\u52A8\u7AEF\u54C1\u7C7B\u5C55\u793A\nconst CategoryMobileItem = ({ data, configuration }: { data: CategoryItem[]; configuration?: any }) => {\n  return (\n    <div className=\"grid grid-cols-2 gap-3\">\n      {data?.map((item, index) => (\n        <SingleMobileItem\n          key={index}\n          index={index}\n          data={item}\n          configuration={configuration}\n          totalCount={data?.length}\n        />\n      ))}\n    </div>\n  )\n}\n\nconst Category = React.forwardRef<HTMLDivElement, CategoryProps>((props, ref) => {\n  const { data, className = '', key, event } = props\n  // soundcore\u54C1\u724C\u54C1\u7C7B\u4E0D\u8D85\u8FC75\u4E2A\uFF0C\u5355\u72EC\u505A\u6837\u5F0F\u5904\u7406\n  const currentData = data?.isShowSelect ? data?.products : data?.productData\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  return (\n    <div ref={innerRef} className={cn('w-full overflow-hidden', className, { 'aiui-dark': data?.theme === 'dark' })}>\n      {data?.title && <Title data={{ title: data?.title }} className=\"text-4xl\" />}\n      <div className=\"tablet:block hidden\">\n        <SwiperBox\n          id={`Category${key}`}\n          Slide={CategoryPcItem}\n          data={{ list: currentData, configuration: { shape: data?.shape, event: event, title: data?.title } }}\n        />\n      </div>\n      <div className=\"tablet:hidden block\">\n        <SwiperBox\n          id={`Category1${key}`}\n          Slide={CategoryMobileItem}\n          data={{\n            list: chunkArray(currentData, 6),\n            configuration: { shape: data?.shape, event: event, title: data?.title },\n          }}\n        />\n      </div>\n      <div className=\"h-7\" />\n    </div>\n  )\n})\n\nexport default withLayout(Category)\n"],
-  "mappings": "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",
-  "names": ["Category_exports", "__export", "Category_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_Styles", "import_Title", "import_SwiperCategory", "import_useExposure", "import_trackUrlRef", "import_heading", "componentType", "componentName", "chunkArray", "arr", "size", "chunks", "i", "CategoryPcItem", "data", "configuration", "ref", "Picture", "SingleMobileItem", "index", "totalCount", "isFirstItemLarger", "isFirstItem", "CategoryMobileItem", "item", "Category", "React", "props", "className", "key", "event", "currentData", "innerRef", "Title", "SwiperBox"]
+  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport Picture from '../../components/picture.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Title from '../Title/index.js'\nimport SwiperBox from './SwiperCategory.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { Img } from '../../types/props.js'\nimport { Heading } from '../../components/heading.js'\n\nconst componentType = 'image'\nconst componentName = 'category_banner'\n\nexport interface CategoryItem {\n  /** \u4EA7\u54C1\u56FE\u7247*/\n  image: Img\n  name: string\n  link?: string\n}\n\nexport interface CategoryProps {\n  className?: string\n  /** \u4E3B\u9898\u8272*/\n  data: {\n    isShowSelect: boolean\n    products: CategoryItem[]\n    productData: CategoryItem[]\n    /** \u5361\u7247\u5F62\u72B6 */\n    shape?: 'round' | 'square'\n    title?: string\n    theme?: 'light' | 'dark'\n  }\n  buildData?: {\n    categories: any[]\n    products: any[]\n  }\n  /** \u6309\u94AE\u4E8B\u4EF6*/\n  event?: {\n    primaryButton?: (v: any, index: number) => void\n  }\n  key?: string\n}\n\nconst chunkArray = (arr: any[], size: number) => {\n  const chunks = []\n  for (let i = 0; i < arr.length; i += size) {\n    chunks.push(arr.slice(i, i + size))\n  }\n  return chunks\n}\n\nconst CategoryPcItem = ({ data, configuration }: { data: CategoryItem; configuration?: any }) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.name,\n    position: configuration?.index + 1,\n  })\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'tablet:h-[120px] laptop:h-[144px] desktop:h-[192px] lg-desktop:h-[240px]',\n        'tablet:p-3 laptop:p-4 desktop:p-6 lg-desktop:p-8',\n        'bg-container-secondary-1 hover:bg-info-white group box-border flex size-full cursor-pointer flex-col overflow-hidden duration-300',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <div className=\"transition-all duration-300 group-hover:scale-110\">\n        <a\n          aria-label={data?.name}\n          href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}\n          data-headless-type-name={`${componentType}#${componentName}`}\n          data-headless-title-desc-button={`${data?.name}`}\n          onClick={() => configuration?.event?.primaryButton(data, configuration?.index)}\n        >\n          <Picture\n            alt={data?.image?.alt || ''}\n            source={data?.image?.url || ''}\n            className=\"laptop:size-[88px] tablet:size-[72px] desktop:size-[116px] lg-desktop:size-[146px] m-auto flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover\"\n          />\n        </a>\n      </div>\n      <Heading\n        as=\"h3\"\n        className=\"lg-desktop:text-[18px] text-info-primary box-border line-clamp-2 flex-1 text-center text-[14px] font-bold\"\n      >\n        {data?.name}\n      </Heading>\n    </div>\n  )\n}\n\n// \u79FB\u52A8\u7AEF\u54C1\u7C7B\u5C55\u793A\u7EC4\u4EF6\nconst SingleMobileItem = ({\n  data,\n  configuration,\n  index,\n}: {\n  data: CategoryItem\n  configuration?: any\n  index: number\n}) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useExposure(ref, {\n    componentType,\n    componentName,\n    componentTitle: data?.name,\n    position: configuration?.index + 1,\n  })\n\n  const totalCategories = configuration?.totalCategories ?? 0\n  // \u5F53\u6570\u91CF\u5C11\u4E8E\u5BB9\u5668\u65F6\uFF0C\u7B2C\u4E00\u4E2A\u9879\u76EE\u4F1A\u5360\u636E\u66F4\u5927\u7A7A\u95F4\n  const isFirstItemLarger = totalCategories < 6\n  const isFirstItem = index === 0\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'bg-container-secondary-1 box-border flex w-full shrink-0 flex-col items-center justify-center overflow-hidden',\n        'hover:bg-info-white cursor-pointer duration-300',\n        // \u5F53\u7B2C\u4E00\u4E2A\u9879\u76EE\u9700\u8981\u66F4\u5927\u7A7A\u95F4\u65F6\u8C03\u6574\u6837\u5F0F\n        isFirstItemLarger\n          ? cn('p-4', isFirstItem ? 'aspect-h-[252] row-span-2' : 'aspect-h-[120]')\n          : 'max-h-[126px] px-3 py-4',\n        configuration?.shape === 'round' ? 'rounded-2xl' : 'rounded-none'\n      )}\n    >\n      <a\n        href={trackUrlRef(data?.link, `${componentType}_${componentName}`)}\n        data-headless-type-name={`${componentType}#${componentName}`}\n        data-headless-title-desc-button={`${data?.name}`}\n        data-headless-nav-postion={`''#${configuration?.index + 1}`}\n        onClick={() => configuration?.event?.primaryButton(data, configuration?.index + 1)}\n      >\n        <Picture\n          source={data?.image?.url || ''}\n          alt={data?.image?.alt || ''}\n          className={cn(\n            'm-auto mb-2 flex justify-center object-cover [&_img]:h-full [&_img]:w-auto [&_img]:object-cover',\n            // \u5F53\u7B2C\u4E00\u4E2A\u9879\u76EE\u9700\u8981\u66F4\u5927\u7A7A\u95F4\u65F6\u8C03\u6574\u56FE\u7247\u5C3A\u5BF8\n            isFirstItemLarger\n              ? cn(isFirstItem ? 'max-h-[146px] overflow-hidden' : 'max-h-[72px] max-w-[72px]')\n              : 'size-[72px]'\n          )}\n        />\n      </a>\n      <p\n        className={cn(\n          'text-info-primary text-center text-sm font-bold',\n          // \u5F53\u7B2C\u4E00\u4E2A\u9879\u76EE\u9700\u8981\u66F4\u5927\u7A7A\u95F4\u65F6\u8C03\u6574\u6587\u5B57\u663E\u793A\n          isFirstItemLarger ? 'line-clamp-2' : 'shrink-0 truncate'\n        )}\n      >\n        {data?.name}\n      </p>\n    </div>\n  )\n}\n\n// \u79FB\u52A8\u7AEF\u54C1\u7C7B\u5C55\u793A\nconst CategoryMobileItem = ({ data, configuration }: { data: CategoryItem[]; configuration?: any }) => {\n  return (\n    <div className=\"flex h-full flex-col gap-3\">\n      {data?.map((item, index) => (\n        <SingleMobileItem key={index} index={index} data={item} configuration={configuration} />\n      ))}\n    </div>\n  )\n}\n\nconst Category = React.forwardRef<HTMLDivElement, CategoryProps>((props, ref) => {\n  const { data, className = '', key, event } = props\n  // soundcore\u54C1\u724C\u54C1\u7C7B\u4E0D\u8D85\u8FC75\u4E2A\uFF0C\u5355\u72EC\u505A\u6837\u5F0F\u5904\u7406\n  const currentData = (data?.isShowSelect ? data?.products : data?.productData) || []\n  const totalCategories = currentData.length\n  const mobileSlides = chunkArray(currentData, 3)\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n  return (\n    <div ref={innerRef} className={cn('w-full overflow-hidden', className, { 'aiui-dark': data?.theme === 'dark' })}>\n      {data?.title && <Title data={{ title: data?.title }} className=\"text-4xl\" />}\n      <div className=\"tablet:block hidden\">\n        <SwiperBox\n          id={`Category${key}`}\n          Slide={CategoryPcItem}\n          data={{\n            list: currentData,\n            configuration: { shape: data?.shape, event: event, title: data?.title, totalCategories },\n          }}\n        />\n      </div>\n      <div className=\"tablet:hidden block\">\n        <SwiperBox\n          id={`Category1${key}`}\n          Slide={CategoryMobileItem}\n          data={{\n            list: mobileSlides,\n            configuration: { shape: data?.shape, event: event, title: data?.title, totalCategories },\n          }}\n        />\n      </div>\n      <div className=\"h-7\" />\n    </div>\n  )\n})\n\nexport default withLayout(Category)\n"],
+  "mappings": "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",
+  "names": ["Category_exports", "__export", "Category_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_picture", "import_Styles", "import_Title", "import_SwiperCategory", "import_useExposure", "import_trackUrlRef", "import_heading", "componentType", "componentName", "chunkArray", "arr", "size", "chunks", "i", "CategoryPcItem", "data", "configuration", "ref", "Picture", "SingleMobileItem", "index", "isFirstItemLarger", "isFirstItem", "CategoryMobileItem", "item", "Category", "React", "props", "className", "key", "event", "currentData", "totalCategories", "mobileSlides", "innerRef", "Title", "SwiperBox"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var x=Object.create;var p=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty;var w=(e,l)=>{for(var o in l)p(e,o,{get:l[o],enumerable:!0})},n=(e,l,o,d)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of g(l))!b.call(e,a)&&a!==o&&p(e,a,{get:()=>l[a],enumerable:!(d=v(l,a))||d.enumerable});return e};var k=(e,l,o)=>(o=e!=null?x(h(e)):{},n(l||!e||!e.__esModule?p(o,"default",{value:e,enumerable:!0}):o,e)),N=e=>n(p({},"__esModule",{value:!0}),e);var C={};w(C,{default:()=>I});module.exports=N(C);var t=require("react/jsx-runtime"),r=require("../../helpers/utils.js"),c=k(require("../SwiperBox/index.js")),u=require("../../shared/Styles.js"),m=require("../../components/gird.js"),i=require("../../components/index.js");const y=({data:e,configuration:l})=>(0,t.jsx)("div",{className:(0,r.cn)("creativeModuleItem","text-info-primary aspect-h-[360] aspect-w-[296] relative flex-1 shrink-0 overflow-hidden md:basis-[296px]",l?.shape==="rounded"?"rounded-2xl":"rounded-none",{"aiui-dark":e.theme==="dark"}),children:(0,t.jsxs)("div",{className:"absolute inset-0",children:[(0,t.jsx)(i.Picture,{className:"h-full",imgClassName:"h-full object-cover",source:e?.mobileImg?.url||e?.img?.url,alt:e?.mobileImg?.alt||e?.img?.alt||""}),(0,t.jsxs)("div",{className:"z-1 absolute inset-x-0 bottom-4 box-border flex w-full flex-col overflow-hidden px-4",children:[(0,t.jsx)(i.Text,{html:e?.title,className:"graphic-title truncate text-xl font-bold leading-[1.2]"}),e?.description&&(0,t.jsx)(i.Text,{html:e?.description,className:"graphic-title line-clamp-2 text-sm font-bold leading-[1.2]"})]})]})}),M=e=>{const{data:l,className:o}=e,{productsTab:d,shape:a}=l;return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:(0,r.cn)("creativeModuleBlock","laptop:block box-border hidden w-full overflow-hidden"),children:(0,t.jsx)(m.Grid,{className:(0,r.cn)("tablet:gap-4 grid grid-cols-12 gap-3 ",o),children:d?.map((s,f)=>(0,t.jsxs)(m.GridItem,{span:s.span,className:(0,r.cn)("text-info-primary relative w-full overflow-hidden",a==="rounded"?"rounded-2xl":"rounded-none","lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[288px]",{"aiui-dark":s.theme==="dark"}),children:[(0,t.jsx)(i.Picture,{source:s.img.url,className:"size-full",imgClassName:"h-full object-cover"}),(0,t.jsxs)("div",{className:"lg-desktop:bottom-8 lg-desktop:px-8 desktop:bottom-6 desktop:px-6 absolute inset-x-0 bottom-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[s.title&&(0,t.jsx)(i.Text,{html:s.title,as:"p",className:"desktop:text-[32px] laptop:text-2xl line-clamp-2 text-xl font-bold"}),s.description&&(0,t.jsx)(i.Text,{html:s.description,className:"desktop:text-lg line-clamp-2 text-sm font-bold"})]})]},f))})}),(0,t.jsx)("div",{className:"laptop:hidden block w-full",children:(0,t.jsx)(c.default,{id:"CreativeModule",className:(0,r.cn)("!overflow-visible",o),data:{list:d||[],configuration:{shape:a}},Slide:y,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3}}})})]})};var I=(0,u.withLayout)(M);
+"use strict";"use client";var x=Object.create;var p=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty;var w=(e,l)=>{for(var o in l)p(e,o,{get:l[o],enumerable:!0})},n=(e,l,o,d)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of g(l))!b.call(e,a)&&a!==o&&p(e,a,{get:()=>l[a],enumerable:!(d=v(l,a))||d.enumerable});return e};var k=(e,l,o)=>(o=e!=null?x(h(e)):{},n(l||!e||!e.__esModule?p(o,"default",{value:e,enumerable:!0}):o,e)),N=e=>n(p({},"__esModule",{value:!0}),e);var C={};w(C,{default:()=>I});module.exports=N(C);var t=require("react/jsx-runtime"),r=require("../../helpers/utils.js"),c=k(require("../SwiperBox/index.js")),u=require("../../shared/Styles.js"),m=require("../../components/grid.js"),i=require("../../components/index.js");const y=({data:e,configuration:l})=>(0,t.jsx)("div",{className:(0,r.cn)("creativeModuleItem","text-info-primary aspect-h-[360] aspect-w-[296] relative flex-1 shrink-0 overflow-hidden md:basis-[296px]",l?.shape==="rounded"?"rounded-2xl":"rounded-none",{"aiui-dark":e.theme==="dark"}),children:(0,t.jsxs)("div",{className:"absolute inset-0",children:[(0,t.jsx)(i.Picture,{className:"h-full",imgClassName:"h-full object-cover",source:e?.mobileImg?.url||e?.img?.url,alt:e?.mobileImg?.alt||e?.img?.alt||""}),(0,t.jsxs)("div",{className:"z-1 absolute inset-x-0 bottom-4 box-border flex w-full flex-col overflow-hidden px-4",children:[(0,t.jsx)(i.Text,{html:e?.title,className:"graphic-title truncate text-xl font-bold leading-[1.2]"}),e?.description&&(0,t.jsx)(i.Text,{html:e?.description,className:"graphic-title line-clamp-2 text-sm font-bold leading-[1.2]"})]})]})}),M=e=>{const{data:l,className:o}=e,{productsTab:d,shape:a}=l;return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)("div",{className:(0,r.cn)("creativeModuleBlock","laptop:block box-border hidden w-full overflow-hidden"),children:(0,t.jsx)(m.Grid,{className:(0,r.cn)("tablet:gap-4 grid grid-cols-12 gap-3 ",o),children:d?.map((s,f)=>(0,t.jsxs)(m.GridItem,{span:s.span,className:(0,r.cn)("text-info-primary relative w-full overflow-hidden",a==="rounded"?"rounded-2xl":"rounded-none","lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[288px]",{"aiui-dark":s.theme==="dark"}),children:[(0,t.jsx)(i.Picture,{source:s.img.url,className:"size-full",imgClassName:"h-full object-cover"}),(0,t.jsxs)("div",{className:"lg-desktop:bottom-8 lg-desktop:px-8 desktop:bottom-6 desktop:px-6 absolute inset-x-0 bottom-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[s.title&&(0,t.jsx)(i.Text,{html:s.title,as:"p",className:"desktop:text-[32px] laptop:text-2xl line-clamp-2 text-xl font-bold"}),s.description&&(0,t.jsx)(i.Text,{html:s.description,className:"desktop:text-lg line-clamp-2 text-sm font-bold"})]})]},f))})}),(0,t.jsx)("div",{className:"laptop:hidden block w-full",children:(0,t.jsx)(c.default,{id:"CreativeModule",className:(0,r.cn)("!overflow-visible",o),data:{list:d||[],configuration:{shape:a}},Slide:y,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3}}})})]})};var I=(0,u.withLayout)(M);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/CreativeModule/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Picture, Text } from '../../components/index.js'\n\nexport type CreativeModuleDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  theme: 'light' | 'dark'\n  span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\n\ntype CreativeModuleType = {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: CreativeModuleDataType[]\n  }\n  className?: string\n}\n\nconst Item = ({ data, configuration }: { data: CreativeModuleDataType; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'creativeModuleItem',\n        'text-info-primary aspect-h-[360] aspect-w-[296] relative flex-1 shrink-0 overflow-hidden md:basis-[296px]',\n        configuration?.shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n        {\n          'aiui-dark': data.theme === 'dark',\n        }\n      )}\n    >\n      <div className=\"absolute inset-0\">\n        <Picture\n          className=\"h-full\"\n          imgClassName=\"h-full object-cover\"\n          source={data?.mobileImg?.url || data?.img?.url}\n          alt={data?.mobileImg?.alt || data?.img?.alt || ''}\n        />\n        <div className=\"z-1 absolute inset-x-0 bottom-4 box-border flex w-full flex-col overflow-hidden px-4\">\n          <Text html={data?.title} className=\"graphic-title truncate text-xl font-bold leading-[1.2]\" />\n          {data?.description && (\n            <Text html={data?.description} className=\"graphic-title line-clamp-2 text-sm font-bold leading-[1.2]\" />\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst CreativeModule = (props: CreativeModuleType) => {\n  const { data, className } = props\n  const { productsTab, shape } = data\n\n  return (\n    <>\n      <div className={cn('creativeModuleBlock', 'laptop:block box-border hidden w-full overflow-hidden')}>\n        <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n          {productsTab?.map((item, index) => {\n            return (\n              <GridItem\n                key={index}\n                span={item.span}\n                className={cn(\n                  'text-info-primary relative w-full overflow-hidden',\n                  shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n                  'lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[288px]',\n                  {\n                    'aiui-dark': item.theme === 'dark',\n                  }\n                )}\n              >\n                <Picture source={item.img.url} className=\"size-full\" imgClassName=\"h-full object-cover\" />\n                <div className=\"lg-desktop:bottom-8 lg-desktop:px-8 desktop:bottom-6 desktop:px-6 absolute inset-x-0 bottom-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {item.title && (\n                    <Text\n                      html={item.title}\n                      as=\"p\"\n                      className=\"desktop:text-[32px] laptop:text-2xl line-clamp-2 text-xl font-bold\"\n                    />\n                  )}\n                  {item.description && (\n                    <Text html={item.description} className=\"desktop:text-lg line-clamp-2 text-sm font-bold\" />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"laptop:hidden block w-full\">\n        <SwiperBox\n          id=\"CreativeModule\"\n          className={cn('!overflow-visible', className)}\n          data={{\n            list: productsTab || [],\n            configuration: {\n              shape,\n            },\n          }}\n          Slide={Item}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1.2,\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n            1024: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(CreativeModule)\n"],
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/grid.js'\nimport { Picture, Text } from '../../components/index.js'\n\nexport type CreativeModuleDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  theme: 'light' | 'dark'\n  span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\n\ntype CreativeModuleType = {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: CreativeModuleDataType[]\n  }\n  className?: string\n}\n\nconst Item = ({ data, configuration }: { data: CreativeModuleDataType; configuration?: any }) => {\n  return (\n    <div\n      className={cn(\n        'creativeModuleItem',\n        'text-info-primary aspect-h-[360] aspect-w-[296] relative flex-1 shrink-0 overflow-hidden md:basis-[296px]',\n        configuration?.shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n        {\n          'aiui-dark': data.theme === 'dark',\n        }\n      )}\n    >\n      <div className=\"absolute inset-0\">\n        <Picture\n          className=\"h-full\"\n          imgClassName=\"h-full object-cover\"\n          source={data?.mobileImg?.url || data?.img?.url}\n          alt={data?.mobileImg?.alt || data?.img?.alt || ''}\n        />\n        <div className=\"z-1 absolute inset-x-0 bottom-4 box-border flex w-full flex-col overflow-hidden px-4\">\n          <Text html={data?.title} className=\"graphic-title truncate text-xl font-bold leading-[1.2]\" />\n          {data?.description && (\n            <Text html={data?.description} className=\"graphic-title line-clamp-2 text-sm font-bold leading-[1.2]\" />\n          )}\n        </div>\n      </div>\n    </div>\n  )\n}\n\nconst CreativeModule = (props: CreativeModuleType) => {\n  const { data, className } = props\n  const { productsTab, shape } = data\n\n  return (\n    <>\n      <div className={cn('creativeModuleBlock', 'laptop:block box-border hidden w-full overflow-hidden')}>\n        <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n          {productsTab?.map((item, index) => {\n            return (\n              <GridItem\n                key={index}\n                span={item.span}\n                className={cn(\n                  'text-info-primary relative w-full overflow-hidden',\n                  shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n                  'lg-desktop:h-[480px] desktop:h-[384px] laptop:h-[288px]',\n                  {\n                    'aiui-dark': item.theme === 'dark',\n                  }\n                )}\n              >\n                <Picture source={item.img.url} className=\"size-full\" imgClassName=\"h-full object-cover\" />\n                <div className=\"lg-desktop:bottom-8 lg-desktop:px-8 desktop:bottom-6 desktop:px-6 absolute inset-x-0 bottom-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {item.title && (\n                    <Text\n                      html={item.title}\n                      as=\"p\"\n                      className=\"desktop:text-[32px] laptop:text-2xl line-clamp-2 text-xl font-bold\"\n                    />\n                  )}\n                  {item.description && (\n                    <Text html={item.description} className=\"desktop:text-lg line-clamp-2 text-sm font-bold\" />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"laptop:hidden block w-full\">\n        <SwiperBox\n          id=\"CreativeModule\"\n          className={cn('!overflow-visible', className)}\n          data={{\n            list: productsTab || [],\n            configuration: {\n              shape,\n            },\n          }}\n          Slide={Item}\n          breakpoints={{\n            0: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1,\n            },\n            374: {\n              spaceBetween: 12,\n              freeMode: false,\n              slidesPerView: 1.2,\n            },\n            768: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 2.3,\n            },\n            1024: {\n              spaceBetween: 16,\n              freeMode: false,\n              slidesPerView: 3,\n            },\n          }}\n        />\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(CreativeModule)\n"],
   "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsCQ,IAAAI,EAAA,6BArCRC,EAAmB,kCACnBC,EAAsB,oCAEtBC,EAA2B,kCAC3BC,EAA+B,oCAC/BC,EAA8B,qCAmB9B,MAAMC,EAAO,CAAC,CAAE,KAAAC,EAAM,cAAAC,CAAc,OAEhC,OAAC,OACC,aAAW,MACT,qBACA,4GACAA,GAAe,QAAU,UAAY,cAAgB,eACrD,CACE,YAAaD,EAAK,QAAU,MAC9B,CACF,EAEA,oBAAC,OAAI,UAAU,mBACb,oBAAC,WACC,UAAU,SACV,aAAa,sBACb,OAAQA,GAAM,WAAW,KAAOA,GAAM,KAAK,IAC3C,IAAKA,GAAM,WAAW,KAAOA,GAAM,KAAK,KAAO,GACjD,KACA,QAAC,OAAI,UAAU,uFACb,oBAAC,QAAK,KAAMA,GAAM,MAAO,UAAU,yDAAyD,EAC3FA,GAAM,gBACL,OAAC,QAAK,KAAMA,GAAM,YAAa,UAAU,6DAA6D,GAE1G,GACF,EACF,EAIEE,EAAkBC,GAA8B,CACpD,KAAM,CAAE,KAAAH,EAAM,UAAAI,CAAU,EAAID,EACtB,CAAE,YAAAE,EAAa,MAAAC,CAAM,EAAIN,EAE/B,SACE,oBACE,oBAAC,OAAI,aAAW,MAAG,sBAAuB,uDAAuD,EAC/F,mBAAC,QAAK,aAAW,MAAG,wCAAyCI,CAAS,EACnE,SAAAC,GAAa,IAAI,CAACE,EAAMC,OAErB,QAAC,YAEC,KAAMD,EAAK,KACX,aAAW,MACT,oDACAD,IAAU,UAAY,cAAgB,eACtC,0DACA,CACE,YAAaC,EAAK,QAAU,MAC9B,CACF,EAEA,oBAAC,WAAQ,OAAQA,EAAK,IAAI,IAAK,UAAU,YAAY,aAAa,sBAAsB,KACxF,QAAC,OAAI,UAAU,6IACZ,UAAAA,EAAK,UACJ,OAAC,QACC,KAAMA,EAAK,MACX,GAAG,IACH,UAAU,qEACZ,EAEDA,EAAK,gBACJ,OAAC,QAAK,KAAMA,EAAK,YAAa,UAAU,iDAAiD,GAE7F,IAvBKC,CAwBP,CAEH,EACH,EACF,KACA,OAAC,OAAI,UAAU,6BACb,mBAAC,EAAAC,QAAA,CACC,GAAG,iBACH,aAAW,MAAG,oBAAqBL,CAAS,EAC5C,KAAM,CACJ,KAAMC,GAAe,CAAC,EACtB,cAAe,CACb,MAAAC,CACF,CACF,EACA,MAAOP,EACP,YAAa,CACX,EAAG,CACD,aAAc,GACd,SAAU,GACV,cAAe,CACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,SAAU,GACV,cAAe,GACjB,EACA,KAAM,CACJ,aAAc,GACd,SAAU,GACV,cAAe,CACjB,CACF,EACF,EACF,GACF,CAEJ,EAEA,IAAOR,KAAQ,cAAWW,CAAc",
-  "names": ["CreativeModule_exports", "__export", "CreativeModule_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_SwiperBox", "import_Styles", "import_gird", "import_components", "Item", "data", "configuration", "CreativeModule", "props", "className", "productsTab", "shape", "item", "index", "SwiperBox"]
+  "names": ["CreativeModule_exports", "__export", "CreativeModule_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_SwiperBox", "import_Styles", "import_grid", "import_components", "Item", "data", "configuration", "CreativeModule", "props", "className", "productsTab", "shape", "item", "index", "SwiperBox"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var n=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var g=(o,l)=>{for(var d in l)n(o,d,{get:l[d],enumerable:!0})},h=(o,l,d,s)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of f(l))!u.call(o,a)&&a!==d&&n(o,a,{get:()=>l[a],enumerable:!(s=x(l,a))||s.enumerable});return o};var v=o=>h(n({},"__esModule",{value:!0}),o);var k={};g(k,{default:()=>N});module.exports=v(k);var e=require("react/jsx-runtime"),i=require("../../helpers/utils.js"),w=require("../SwiperBox/index.js"),c=require("../../shared/Styles.js"),p=require("../../components/gird.js"),r=require("../../components/index.js");const b=o=>{const{data:l,className:d}=o,{productsTab:s,shape:a}=l;return(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:(0,i.cn)("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]"),children:(0,e.jsx)(p.Grid,{className:(0,i.cn)("tablet:gap-4 grid grid-cols-12 gap-3 ",d),children:s?.map((t,m)=>(0,e.jsxs)(p.GridItem,{span:t.span,className:(0,i.cn)("text-info-primary relative w-full overflow-hidden",a==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":t?.theme==="dark"}),children:[(0,e.jsx)(r.Picture,{source:t?.img?.url,className:"size-full",imgClassName:""}),(0,e.jsxs)("div",{className:"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[t?.title&&(0,e.jsx)(r.Text,{html:t?.title,as:"p",className:"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(r.Text,{html:t?.description,className:"desktop:text-lg line-clamp-2 text-sm font-bold"})]})]},m))})}),(0,e.jsx)("div",{className:"tablet:hidden block text-[#1D1D1F]",children:(0,e.jsx)("div",{className:" flex flex-wrap gap-[12px]",children:s?.map((t,m)=>(0,e.jsxs)("div",{className:(0,i.cn)("text-info-primary relative overflow-hidden",a==="rounded"?"rounded-xl":"rounded-none",{"aiui-dark":t?.theme==="dark"},t?.fullWidth==="true"?"w-full flex-none":" w-[calc(50%-6px)]"),children:[(0,e.jsx)(r.Picture,{source:t?.mobileImg?.url,className:"size-full",imgClassName:"h-full object-cover"}),(0,e.jsxs)("div",{className:"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[t?.title&&(0,e.jsx)(r.Text,{html:t?.title,as:"p",className:"line-clamp-3 text-xl font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(r.Text,{html:t?.description,className:"line-clamp-2 text-xl font-bold"})]})]},m))})})]})};var N=(0,c.withLayout)(b);
+"use strict";"use client";var n=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var g=(o,l)=>{for(var d in l)n(o,d,{get:l[d],enumerable:!0})},h=(o,l,d,s)=>{if(l&&typeof l=="object"||typeof l=="function")for(let a of f(l))!u.call(o,a)&&a!==d&&n(o,a,{get:()=>l[a],enumerable:!(s=x(l,a))||s.enumerable});return o};var v=o=>h(n({},"__esModule",{value:!0}),o);var k={};g(k,{default:()=>N});module.exports=v(k);var e=require("react/jsx-runtime"),i=require("../../helpers/utils.js"),w=require("../SwiperBox/index.js"),c=require("../../shared/Styles.js"),p=require("../../components/grid.js"),r=require("../../components/index.js");const b=o=>{const{data:l,className:d}=o,{productsTab:s,shape:a}=l;return(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{className:(0,i.cn)("creativeModuleBlock","tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]"),children:(0,e.jsx)(p.Grid,{className:(0,i.cn)("tablet:gap-4 grid grid-cols-12 gap-3 ",d),children:s?.map((t,m)=>(0,e.jsxs)(p.GridItem,{span:t.span,className:(0,i.cn)("text-info-primary relative w-full overflow-hidden",a==="rounded"?"rounded-2xl":"rounded-none","",{"aiui-dark":t?.theme==="dark"}),children:[(0,e.jsx)(r.Picture,{source:t?.img?.url,className:"size-full",imgClassName:""}),(0,e.jsxs)("div",{className:"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[t?.title&&(0,e.jsx)(r.Text,{html:t?.title,as:"p",className:"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(r.Text,{html:t?.description,className:"desktop:text-lg line-clamp-2 text-sm font-bold"})]})]},m))})}),(0,e.jsx)("div",{className:"tablet:hidden block text-[#1D1D1F]",children:(0,e.jsx)("div",{className:" flex flex-wrap gap-[12px]",children:s?.map((t,m)=>(0,e.jsxs)("div",{className:(0,i.cn)("text-info-primary relative overflow-hidden",a==="rounded"?"rounded-xl":"rounded-none",{"aiui-dark":t?.theme==="dark"},t?.fullWidth==="true"?"w-full flex-none":" w-[calc(50%-6px)]"),children:[(0,e.jsx)(r.Picture,{source:t?.mobileImg?.url,className:"size-full",imgClassName:"h-full object-cover"}),(0,e.jsxs)("div",{className:"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4",children:[t?.title&&(0,e.jsx)(r.Text,{html:t?.title,as:"p",className:"line-clamp-3 text-xl font-bold leading-[1.2]"}),t?.description&&(0,e.jsx)(r.Text,{html:t?.description,className:"line-clamp-2 text-xl font-bold"})]})]},m))})})]})};var N=(0,c.withLayout)(b);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/GraphicMore/index.tsx"],
-  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Picture, Text } from '../../components/index.js'\nexport type GraphicMoreDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  theme: 'light' | 'dark'\n  fullWidth: 'true' | 'false'\n  span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\ntype GraphicMoreType = {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: GraphicMoreDataType[]\n  }\n  className?: string\n}\n\nconst GraphicMore = (props: GraphicMoreType) => {\n  const { data, className } = props\n  const { productsTab, shape } = data\n\n  return (\n    <>\n      <div\n        className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]')}\n      >\n        <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n          {productsTab?.map((item, index) => {\n            return (\n              <GridItem\n                key={index}\n                span={item.span}\n                className={cn(\n                  'text-info-primary relative w-full overflow-hidden',\n                  shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n                  '',\n                  {\n                    'aiui-dark': item?.theme === 'dark',\n                  }\n                )}\n              >\n                <Picture source={item?.img?.url} className=\"size-full\" imgClassName=\"\" />\n                <div className=\"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {item?.title && (\n                    <Text\n                      html={item?.title}\n                      as=\"p\"\n                      className=\"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]\"\n                    />\n                  )}\n                  {item?.description && (\n                    <Text html={item?.description} className=\"desktop:text-lg line-clamp-2 text-sm font-bold\" />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"tablet:hidden block text-[#1D1D1F]\">\n        <div className=\" flex flex-wrap gap-[12px]\">\n          {productsTab?.map((it, ind) => {\n            return (\n              <div\n                key={ind}\n                className={cn(\n                  'text-info-primary relative overflow-hidden',\n                  shape === 'rounded' ? 'rounded-xl' : 'rounded-none',\n                  { 'aiui-dark': it?.theme === 'dark' },\n                  it?.fullWidth === 'true'\n                    ? 'w-full flex-none' // \u5360\u6EE1\u6574\u884C\n                    : ' w-[calc(50%-6px)]' // \u666E\u901A\u5143\u7D20\n                )}\n              >\n                <Picture source={it?.mobileImg?.url} className=\"size-full\" imgClassName=\"h-full object-cover\" />\n                <div className=\"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {it?.title && (\n                    <Text html={it?.title} as=\"p\" className=\"line-clamp-3 text-xl font-bold leading-[1.2]\" />\n                  )}\n                  {it?.description && <Text html={it?.description} className=\"line-clamp-2 text-xl font-bold\" />}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(GraphicMore)\n"],
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/utils.js'\nimport SwiperBox from '../SwiperBox/index.js'\nimport type { Img } from '../../types/props.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { Grid, GridItem } from '../../components/grid.js'\nimport { Picture, Text } from '../../components/index.js'\nexport type GraphicMoreDataType = {\n  img: Img\n  mobileImg: Img\n  title: string\n  description: string\n  theme: 'light' | 'dark'\n  fullWidth: 'true' | 'false'\n  span: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n}\ntype GraphicMoreType = {\n  data: {\n    shape?: 'rounded' | 'square'\n    productsTab: GraphicMoreDataType[]\n  }\n  className?: string\n}\n\nconst GraphicMore = (props: GraphicMoreType) => {\n  const { data, className } = props\n  const { productsTab, shape } = data\n\n  return (\n    <>\n      <div\n        className={cn('creativeModuleBlock', 'tablet:block box-border hidden w-full overflow-hidden text-[#1D1D1F]')}\n      >\n        <Grid className={cn('tablet:gap-4 grid grid-cols-12 gap-3 ', className)}>\n          {productsTab?.map((item, index) => {\n            return (\n              <GridItem\n                key={index}\n                span={item.span}\n                className={cn(\n                  'text-info-primary relative w-full overflow-hidden',\n                  shape === 'rounded' ? 'rounded-2xl' : 'rounded-none',\n                  '',\n                  {\n                    'aiui-dark': item?.theme === 'dark',\n                  }\n                )}\n              >\n                <Picture source={item?.img?.url} className=\"size-full\" imgClassName=\"\" />\n                <div className=\"footBottom lg-desktop:top-8 lg-desktop:px-8 desktop:top-6 desktop:px-6 absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {item?.title && (\n                    <Text\n                      html={item?.title}\n                      as=\"p\"\n                      className=\"lg-desktop:text-[24px] line-clamp-2 text-[20px] font-bold leading-[1.2]\"\n                    />\n                  )}\n                  {item?.description && (\n                    <Text html={item?.description} className=\"desktop:text-lg line-clamp-2 text-sm font-bold\" />\n                  )}\n                </div>\n              </GridItem>\n            )\n          })}\n        </Grid>\n      </div>\n      <div className=\"tablet:hidden block text-[#1D1D1F]\">\n        <div className=\" flex flex-wrap gap-[12px]\">\n          {productsTab?.map((it, ind) => {\n            return (\n              <div\n                key={ind}\n                className={cn(\n                  'text-info-primary relative overflow-hidden',\n                  shape === 'rounded' ? 'rounded-xl' : 'rounded-none',\n                  { 'aiui-dark': it?.theme === 'dark' },\n                  it?.fullWidth === 'true'\n                    ? 'w-full flex-none' // \u5360\u6EE1\u6574\u884C\n                    : ' w-[calc(50%-6px)]' // \u666E\u901A\u5143\u7D20\n                )}\n              >\n                <Picture source={it?.mobileImg?.url} className=\"size-full\" imgClassName=\"h-full object-cover\" />\n                <div className=\"footBottomMob absolute inset-x-0 top-4 flex flex-col gap-[6px] overflow-hidden px-4\">\n                  {it?.title && (\n                    <Text html={it?.title} as=\"p\" className=\"line-clamp-3 text-xl font-bold leading-[1.2]\" />\n                  )}\n                  {it?.description && <Text html={it?.description} className=\"line-clamp-2 text-xl font-bold\" />}\n                </div>\n              </div>\n            )\n          })}\n        </div>\n      </div>\n    </>\n  )\n}\n\nexport default withLayout(GraphicMore)\n"],
   "mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6BI,IAAAI,EAAA,6BA5BJC,EAAmB,kCACnBC,EAAsB,iCAEtBC,EAA2B,kCAC3BC,EAA+B,oCAC/BC,EAA8B,qCAkB9B,MAAMC,EAAeC,GAA2B,CAC9C,KAAM,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAIF,EACtB,CAAE,YAAAG,EAAa,MAAAC,CAAM,EAAIH,EAE/B,SACE,oBACE,oBAAC,OACC,aAAW,MAAG,sBAAuB,sEAAsE,EAE3G,mBAAC,QAAK,aAAW,MAAG,wCAAyCC,CAAS,EACnE,SAAAC,GAAa,IAAI,CAACE,EAAMC,OAErB,QAAC,YAEC,KAAMD,EAAK,KACX,aAAW,MACT,oDACAD,IAAU,UAAY,cAAgB,eACtC,GACA,CACE,YAAaC,GAAM,QAAU,MAC/B,CACF,EAEA,oBAAC,WAAQ,OAAQA,GAAM,KAAK,IAAK,UAAU,YAAY,aAAa,GAAG,KACvE,QAAC,OAAI,UAAU,+IACZ,UAAAA,GAAM,UACL,OAAC,QACC,KAAMA,GAAM,MACZ,GAAG,IACH,UAAU,0EACZ,EAEDA,GAAM,gBACL,OAAC,QAAK,KAAMA,GAAM,YAAa,UAAU,iDAAiD,GAE9F,IAvBKC,CAwBP,CAEH,EACH,EACF,KACA,OAAC,OAAI,UAAU,qCACb,mBAAC,OAAI,UAAU,6BACZ,SAAAH,GAAa,IAAI,CAACI,EAAIC,OAEnB,QAAC,OAEC,aAAW,MACT,6CACAJ,IAAU,UAAY,aAAe,eACrC,CAAE,YAAaG,GAAI,QAAU,MAAO,EACpCA,GAAI,YAAc,OACd,mBACA,oBACN,EAEA,oBAAC,WAAQ,OAAQA,GAAI,WAAW,IAAK,UAAU,YAAY,aAAa,sBAAsB,KAC9F,QAAC,OAAI,UAAU,sFACZ,UAAAA,GAAI,UACH,OAAC,QAAK,KAAMA,GAAI,MAAO,GAAG,IAAI,UAAU,+CAA+C,EAExFA,GAAI,gBAAe,OAAC,QAAK,KAAMA,GAAI,YAAa,UAAU,iCAAiC,GAC9F,IAhBKC,CAiBP,CAEH,EACH,EACF,GACF,CAEJ,EAEA,IAAOjB,KAAQ,cAAWQ,CAAW",
-  "names": ["GraphicMore_exports", "__export", "GraphicMore_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_SwiperBox", "import_Styles", "import_gird", "import_components", "GraphicMore", "props", "data", "className", "productsTab", "shape", "item", "index", "it", "ind"]
+  "names": ["GraphicMore_exports", "__export", "GraphicMore_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "import_SwiperBox", "import_Styles", "import_grid", "import_components", "GraphicMore", "props", "data", "className", "productsTab", "shape", "item", "index", "it", "ind"]
 }

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

@@ -15,7 +15,7 @@ declare const _default: import("react").ForwardRefExoticComponent<Omit<{
         } | undefined;
         slug: string;
         payload?: any;
-    } & Omit<import("../../types/graphql.js").Product, "media" | "metafields" | "price" | "options" | "images" | "variants"> & {
+    } & Omit<import("../../types/graphql.js").Product, "media" | "options" | "metafields" | "price" | "images" | "variants"> & {
         variant: ProductVariant;
     })[];
     variant: ProductVariant;

package/dist/cjs/biz-components/Listing/hooks/useBenefits.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/biz-components/Listing/hooks/useBenefits.ts"],
-  "sourcesContent": ["import { useBizProductContext } from '../BizProductProvider.js'\nimport type { ProductVariant, FreeGift, Bundle } from '../types/product'\nimport { checkItemAvailableForProduct } from '../utils/helper.js'\nimport { useDiscountEnable } from './useDiscountEnable.js'\n\nimport { useAiuiContext } from '../../AiuiProvider/index.js'\n\ninterface BenefitsParams {\n  variant: ProductVariant\n}\n\ninterface BenefitItemConfig<T extends Record<string, any> = Record<string, any>> {\n  enable: boolean\n  config?: T // \u539F\u59CB\u914D\u7F6E\n}\n\ninterface BenefitsResult {\n  /**\n   * \u901A\u7528\u4F18\u60E0\u5238\n   */\n  commonCoupon?: BenefitItemConfig\n  /**\n   * \u4E70\u8D60\n   */\n  freeGift: BenefitItemConfig<FreeGift>\n  /**\n   * \u6346\u7ED1\u6298\u6263\n   */\n  bundle: BenefitItemConfig<Bundle>\n  /**\n   * \u4F1A\u5458\u4EF7\n   */\n  memberDiscount: BenefitItemConfig\n  /**\n   * \u79EF\u5206\u62B5\u73B0\n   */\n  creditsRedemption: BenefitItemConfig\n  /**\n   * \u9AD8\u6807\u7269\u6D41\n   */\n  paidShipping: BenefitItemConfig\n\n  /**\n   * \u6EE1\u8D60\n   */\n  fullGift: BenefitItemConfig\n\n  /**\n   * \u6EE1\u51CF\u6298\u6263\n   */\n  levelDiscount: BenefitItemConfig\n}\n\n/**\n * \u5546\u54C1\u6743\u76CA\n * \u83B7\u53D6\u5F53\u524Dsku \u6240\u6709\u7684\u6743\u76CA\n * \u5305\u62EC \u901A\u7528\u4F18\u60E0\u5238\uFF0C\u4F1A\u5458\u4EF7\uFF0C\u6EE1\u51CF\uFF0C\u6346\u7ED1\u6298\u6263\uFF0C\u4E70\u8D60 \uFF0C\u6EE1\u8D60 \uFF0C\u79EF\u5206\u62B5\u73B0\n * @returns\n */\nexport const useBenefits = ({ variant }: BenefitsParams): BenefitsResult => {\n  const { coupon, product, bundle, freeGift, memberFunctionResult, creditsRedemption, profile } = useBizProductContext()\n\n  const { amount: creditsRedemptionAmount } = creditsRedemption ?? {}\n\n  const { trackingData } = useAiuiContext()\n\n  const total = Math.max(\n    memberFunctionResult?.withCouponMemberTotalSave ?? 0,\n    memberFunctionResult?.withoutCouponMaxMemberTotalSave ?? 0\n  )\n\n  const discountEnable = useDiscountEnable({ profile, variant, memberFunctionResult, coupon })\n\n  // \u9AD8\u6807\u7269\u6D41\n  const showPaidShipping = Boolean(\n    trackingData?.paidShipping &&\n      variant.requiresShipping &&\n      !variant?.metafields?.global?.presell &&\n      !variant?.metafields?.global?.HideShipping\n  )\n\n  // \u811A\u672C\u6EE1\u8D60\n  const fullGift = trackingData?.freeGift\n  const excludeProducts =\n    fullGift?.excludeProducts?.map((item: any) => (typeof item === 'object' && 'sku' in item ? item.sku : item)) ?? []\n\n  const showLevelDiscount =\n    trackingData?.levelDiscount && checkItemAvailableForProduct({ product, variant, item: trackingData?.levelDiscount })\n\n  return {\n    commonCoupon: {\n      enable: discountEnable.showCommonCoupon && Boolean(coupon),\n      config: coupon ?? {},\n    },\n    freeGift: {\n      enable: Boolean(freeGift) && !!freeGift?.giftList?.length,\n      config: freeGift,\n    },\n    bundle: {\n      enable:\n        Boolean(bundle) &&\n        !!bundle?.bundleList?.length &&\n        Math.max(...(bundle?.bundleList?.map(item => item.savings ?? 0) ?? [])) > 0, // \u6709\u4F18\u60E0\u624D\u5C55\u793A\n      config: bundle,\n    },\n    memberDiscount: {\n      enable: discountEnable.showMemberDiscount,\n      // enable: total > 0,\n      config: {\n        amount: total,\n        description: memberFunctionResult?.labels?.[0],\n      },\n    },\n    creditsRedemption: {\n      enable: Boolean(creditsRedemptionAmount) && creditsRedemptionAmount! > 0,\n      config: { amount: creditsRedemptionAmount, label: trackingData?.creditsRedemptionLabel },\n    },\n    paidShipping: {\n      enable: showPaidShipping,\n      config: {},\n    },\n    fullGift: {\n      enable: Boolean(fullGift && !excludeProducts.includes(variant.sku)),\n      config: fullGift ?? {},\n    },\n    levelDiscount: {\n      enable: Boolean(showLevelDiscount),\n      config: trackingData?.levelDiscount ?? {},\n    },\n  }\n}\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAqC,oCAErCC,EAA6C,8BAC7CC,EAAkC,kCAElCC,EAA+B,uCAsDxB,MAAML,EAAc,CAAC,CAAE,QAAAM,CAAQ,IAAsC,CAC1E,KAAM,CAAE,OAAAC,EAAQ,QAAAC,EAAS,OAAAC,EAAQ,SAAAC,EAAU,qBAAAC,EAAsB,kBAAAC,EAAmB,QAAAC,CAAQ,KAAI,wBAAqB,EAE/G,CAAE,OAAQC,CAAwB,EAAIF,GAAqB,CAAC,EAE5D,CAAE,aAAAG,CAAa,KAAI,kBAAe,EAElCC,EAAQ,KAAK,IACjBL,GAAsB,2BAA6B,EACnDA,GAAsB,iCAAmC,CAC3D,EAEMM,KAAiB,qBAAkB,CAAE,QAAAJ,EAAS,QAAAP,EAAS,qBAAAK,EAAsB,OAAAJ,CAAO,CAAC,EAGrFW,EAAmB,GACvBH,GAAc,cACZT,EAAQ,kBACR,CAACA,GAAS,YAAY,QAAQ,SAC9B,CAACA,GAAS,YAAY,QAAQ,cAI5Ba,EAAWJ,GAAc,SACzBK,EACJD,GAAU,iBAAiB,IAAKE,GAAe,OAAOA,GAAS,UAAY,QAASA,EAAOA,EAAK,IAAMA,CAAK,GAAK,CAAC,EAE7GC,EACJP,GAAc,kBAAiB,gCAA6B,CAAE,QAAAP,EAAS,QAAAF,EAAS,KAAMS,GAAc,aAAc,CAAC,EAErH,MAAO,CACL,aAAc,CACZ,OAAQE,EAAe,kBAAoB,EAAQV,EACnD,OAAQA,GAAU,CAAC,CACrB,EACA,SAAU,CACR,OAAQ,EAAQG,GAAa,CAAC,CAACA,GAAU,UAAU,OACnD,OAAQA,CACV,EACA,OAAQ,CACN,OACE,EAAQD,GACR,CAAC,CAACA,GAAQ,YAAY,QACtB,KAAK,IAAI,GAAIA,GAAQ,YAAY,IAAIY,GAAQA,EAAK,SAAW,CAAC,GAAK,CAAC,CAAE,EAAI,EAC5E,OAAQZ,CACV,EACA,eAAgB,CACd,OAAQQ,EAAe,mBAEvB,OAAQ,CACN,OAAQD,EACR,YAAaL,GAAsB,SAAS,CAAC,CAC/C,CACF,EACA,kBAAmB,CACjB,OAAQ,EAAQG,GAA4BA,EAA2B,EACvE,OAAQ,CAAE,OAAQA,EAAyB,MAAOC,GAAc,sBAAuB,CACzF,EACA,aAAc,CACZ,OAAQG,EACR,OAAQ,CAAC,CACX,EACA,SAAU,CACR,OAAQ,GAAQC,GAAY,CAACC,EAAgB,SAASd,EAAQ,GAAG,GACjE,OAAQa,GAAY,CAAC,CACvB,EACA,cAAe,CACb,OAAQ,EAAQG,EAChB,OAAQP,GAAc,eAAiB,CAAC,CAC1C,CACF,CACF",
+  "sourcesContent": ["import { useBizProductContext } from '../BizProductProvider.js'\nimport type { ProductVariant, FreeGift, Bundle } from '../types/product'\nimport { checkItemAvailableForProduct } from '../utils/helper.js'\nimport { useDiscountEnable } from './useDiscountEnable.js'\n\nimport { useAiuiContext } from '../../AiuiProvider/index.js'\n\ninterface BenefitsParams {\n  variant: ProductVariant\n}\n\ninterface BenefitItemConfig<T extends Record<string, any> = Record<string, any>> {\n  enable: boolean\n  config?: T // \u539F\u59CB\u914D\u7F6E\n}\n\ninterface BenefitsResult {\n  /**\n   * \u901A\u7528\u4F18\u60E0\u5238\n   */\n  commonCoupon?: BenefitItemConfig\n  /**\n   * \u4E70\u8D60\n   */\n  freeGift: BenefitItemConfig<FreeGift>\n  /**\n   * \u6346\u7ED1\u6298\u6263\n   */\n  bundle: BenefitItemConfig<Bundle>\n  /**\n   * \u4F1A\u5458\u4EF7\n   */\n  memberDiscount: BenefitItemConfig\n  /**\n   * \u79EF\u5206\u62B5\u73B0\n   */\n  creditsRedemption: BenefitItemConfig\n  /**\n   * \u9AD8\u6807\u7269\u6D41\n   */\n  paidShipping: BenefitItemConfig\n\n  /**\n   * \u6EE1\u8D60\n   */\n  fullGift: BenefitItemConfig\n\n  /**\n   * \u6EE1\u51CF\u6298\u6263\n   */\n  levelDiscount: BenefitItemConfig\n}\n\n/**\n * \u5546\u54C1\u6743\u76CA\n * \u83B7\u53D6\u5F53\u524Dsku \u6240\u6709\u7684\u6743\u76CA\n * \u5305\u62EC \u901A\u7528\u4F18\u60E0\u5238\uFF0C\u4F1A\u5458\u4EF7\uFF0C\u6EE1\u51CF\uFF0C\u6346\u7ED1\u6298\u6263\uFF0C\u4E70\u8D60 \uFF0C\u6EE1\u8D60 \uFF0C\u79EF\u5206\u62B5\u73B0\n * @returns\n */\nexport const useBenefits = ({ variant }: BenefitsParams): BenefitsResult => {\n  const { coupon, product, bundle, freeGift, memberFunctionResult, creditsRedemption, profile } = useBizProductContext()\n\n  const { amount: creditsRedemptionAmount } = creditsRedemption ?? {}\n\n  const { trackingData } = useAiuiContext()\n\n  const total = Math.max(\n    memberFunctionResult?.withCouponMemberTotalSave ?? 0,\n    memberFunctionResult?.withoutCouponMaxMemberTotalSave ?? 0\n  )\n\n  const discountEnable = useDiscountEnable({ profile, variant, memberFunctionResult, coupon })\n\n  // \u9AD8\u6807\u7269\u6D41\n  const showPaidShipping = Boolean(\n    trackingData?.paidShipping &&\n    variant.requiresShipping &&\n    !variant?.metafields?.global?.presell &&\n    !variant?.metafields?.global?.HideShipping\n  )\n\n  // \u811A\u672C\u6EE1\u8D60\n  const fullGift = trackingData?.freeGift\n  const excludeProducts =\n    fullGift?.excludeProducts?.map((item: any) => (typeof item === 'object' && 'sku' in item ? item.sku : item)) ?? []\n\n  const showLevelDiscount =\n    trackingData?.levelDiscount && checkItemAvailableForProduct({ product, variant, item: trackingData?.levelDiscount })\n\n  return {\n    commonCoupon: {\n      enable: discountEnable.showCommonCoupon && Boolean(coupon),\n      config: coupon ?? {},\n    },\n    freeGift: {\n      enable: Boolean(freeGift) && !!freeGift?.giftList?.length,\n      config: freeGift,\n    },\n    bundle: {\n      enable:\n        Boolean(bundle) &&\n        !!bundle?.bundleList?.length &&\n        Math.max(...(bundle?.bundleList?.map(item => item.savings ?? 0) ?? [])) > 0, // \u6709\u4F18\u60E0\u624D\u5C55\u793A\n      config: bundle,\n    },\n    memberDiscount: {\n      enable: discountEnable.showMemberDiscount,\n      // enable: total > 0,\n      config: {\n        amount: total,\n        description: memberFunctionResult?.labels?.[0],\n      },\n    },\n    creditsRedemption: {\n      enable: Boolean(creditsRedemptionAmount) && creditsRedemptionAmount! > 0,\n      config: { amount: creditsRedemptionAmount, label: trackingData?.creditsRedemptionLabel },\n    },\n    paidShipping: {\n      enable: showPaidShipping,\n      config: {},\n    },\n    fullGift: {\n      enable: Boolean(fullGift && !excludeProducts.includes(variant.sku)),\n      config: fullGift ?? {},\n    },\n    levelDiscount: {\n      enable: Boolean(showLevelDiscount),\n      config: trackingData?.levelDiscount ?? {},\n    },\n  }\n}\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAqC,oCAErCC,EAA6C,8BAC7CC,EAAkC,kCAElCC,EAA+B,uCAsDxB,MAAML,EAAc,CAAC,CAAE,QAAAM,CAAQ,IAAsC,CAC1E,KAAM,CAAE,OAAAC,EAAQ,QAAAC,EAAS,OAAAC,EAAQ,SAAAC,EAAU,qBAAAC,EAAsB,kBAAAC,EAAmB,QAAAC,CAAQ,KAAI,wBAAqB,EAE/G,CAAE,OAAQC,CAAwB,EAAIF,GAAqB,CAAC,EAE5D,CAAE,aAAAG,CAAa,KAAI,kBAAe,EAElCC,EAAQ,KAAK,IACjBL,GAAsB,2BAA6B,EACnDA,GAAsB,iCAAmC,CAC3D,EAEMM,KAAiB,qBAAkB,CAAE,QAAAJ,EAAS,QAAAP,EAAS,qBAAAK,EAAsB,OAAAJ,CAAO,CAAC,EAGrFW,EAAmB,GACvBH,GAAc,cACdT,EAAQ,kBACR,CAACA,GAAS,YAAY,QAAQ,SAC9B,CAACA,GAAS,YAAY,QAAQ,cAI1Ba,EAAWJ,GAAc,SACzBK,EACJD,GAAU,iBAAiB,IAAKE,GAAe,OAAOA,GAAS,UAAY,QAASA,EAAOA,EAAK,IAAMA,CAAK,GAAK,CAAC,EAE7GC,EACJP,GAAc,kBAAiB,gCAA6B,CAAE,QAAAP,EAAS,QAAAF,EAAS,KAAMS,GAAc,aAAc,CAAC,EAErH,MAAO,CACL,aAAc,CACZ,OAAQE,EAAe,kBAAoB,EAAQV,EACnD,OAAQA,GAAU,CAAC,CACrB,EACA,SAAU,CACR,OAAQ,EAAQG,GAAa,CAAC,CAACA,GAAU,UAAU,OACnD,OAAQA,CACV,EACA,OAAQ,CACN,OACE,EAAQD,GACR,CAAC,CAACA,GAAQ,YAAY,QACtB,KAAK,IAAI,GAAIA,GAAQ,YAAY,IAAIY,GAAQA,EAAK,SAAW,CAAC,GAAK,CAAC,CAAE,EAAI,EAC5E,OAAQZ,CACV,EACA,eAAgB,CACd,OAAQQ,EAAe,mBAEvB,OAAQ,CACN,OAAQD,EACR,YAAaL,GAAsB,SAAS,CAAC,CAC/C,CACF,EACA,kBAAmB,CACjB,OAAQ,EAAQG,GAA4BA,EAA2B,EACvE,OAAQ,CAAE,OAAQA,EAAyB,MAAOC,GAAc,sBAAuB,CACzF,EACA,aAAc,CACZ,OAAQG,EACR,OAAQ,CAAC,CACX,EACA,SAAU,CACR,OAAQ,GAAQC,GAAY,CAACC,EAAgB,SAASd,EAAQ,GAAG,GACjE,OAAQa,GAAY,CAAC,CACvB,EACA,cAAe,CACb,OAAQ,EAAQG,EAChB,OAAQP,GAAc,eAAiB,CAAC,CAC1C,CACF,CACF",
   "names": ["useBenefits_exports", "__export", "useBenefits", "__toCommonJS", "import_BizProductProvider", "import_helper", "import_useDiscountEnable", "import_AiuiProvider", "variant", "coupon", "product", "bundle", "freeGift", "memberFunctionResult", "creditsRedemption", "profile", "creditsRedemptionAmount", "trackingData", "total", "discountEnable", "showPaidShipping", "fullGift", "excludeProducts", "item", "showLevelDiscount"]
 }

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

@@ -1,2 +1,2 @@
-"use strict";"use client";var oe=Object.create;var v=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var le=Object.getPrototypeOf,ce=Object.prototype.hasOwnProperty;var de=(r,s)=>{for(var t in s)v(r,t,{get:s[t],enumerable:!0})},S=(r,s,t,o)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of ie(s))!ce.call(r,n)&&n!==t&&v(r,n,{get:()=>s[n],enumerable:!(o=ne(s,n))||o.enumerable});return r};var l=(r,s,t)=>(t=r!=null?oe(le(r)):{},S(s||!r||!r.__esModule?v(t,"default",{value:r,enumerable:!0}):t,r)),pe=r=>S(v({},"__esModule",{value:!0}),r);var ye={};de(ye,{default:()=>fe});module.exports=pe(ye);var e=require("react/jsx-runtime"),a=l(require("react")),L=require("es-toolkit"),P=require("react-intersection-observer"),u=require("../../helpers/utils.js"),$=require("../../shared/Styles.js"),B=l(require("../Slogan/index.js")),Y=require("../VideoModal/YouTubePlayer.js"),d=require("../../components/gird.js"),q=require("../../components/container.js"),F=l(require("../BrandEquity/index.js")),I=l(require("../MemberEquity/index.js")),j=l(require("../Spacer/index.js")),G=l(require("gsap")),N=require("@payloadcms/richtext-lexical/html"),k=require("react-responsive"),V=l(require("../../helpers/ScrollLoadVideo.js"));const T=({defaultConverters:r})=>({...r,text:s=>{const{node:t}=s;return t.$&&t.$.color?`<span class="lexical-${t.$.color}">${t.text}</span>`:t.text}}),x=({children:r,spaceY:s,className:t})=>{const o=(0,k.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(q.Container,{spaceY:s,className:(0,u.cn)("!bg-transparent",t),children:(0,e.jsxs)(d.Grid,{children:[!o&&(0,e.jsx)(d.GridItem,{span:1}),(0,e.jsx)(d.GridItem,{span:o?12:10,children:r}),!o&&(0,e.jsx)(d.GridItem,{span:1})]})})},me=a.default.forwardRef(({children:r,id:s,components:t},o)=>{const n=(0,a.useRef)(null);return(0,e.jsxs)("div",{ref:n,className:"relative z-10",children:[(0,e.jsx)(e.Fragment,{children:r}),(0,e.jsx)(e.Fragment,{children:t?.map(i=>{switch(i.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(F.default,{data:i,style:i?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(I.default,{data:i,className:"w-full",style:i?.style})})});case"ipc-spacer":return(0,e.jsx)(j.default,{data:i,style:i?.style,className:"!bg-transparent"});default:return null}})})]})}),ue=(0,a.forwardRef)(({className:r="",wrapperClassName:s="",id:t,data:{title:o,videoTitle:n,mobVideo:i,mobImg:f,img:y,isYouTube:Q,youtubePcId:M,youtubeMobileId:O,video:b,theme:R,shape:W,components:_}},ve)=>{const H=(0,a.useRef)(null),w=(0,a.useRef)(null),{ref:A,inView:p}=(0,P.useInView)(),[be,J]=(0,a.useState)(0),[z,K]=(0,a.useState)(!1),[U,X]=(0,a.useState)(!1),Z=(0,a.useRef)(null),D=typeof o=="string"?o:o&&(0,N.convertLexicalToHTML)({data:o,converters:T});typeof n=="string"||n&&(0,N.convertLexicalToHTML)({data:n,converters:T});const[ee,te]=(0,a.useState)(0),[c,re]=(0,a.useState)(!1),C=(0,k.useMediaQuery)({query:"(max-width: 768px)"});(0,a.useEffect)(()=>{re(C)},[C]);const g=(0,L.debounce)(()=>{if(w.current){const h=w.current.getBoundingClientRect(),m=c?window.screen.height:window.innerHeight,ae=window.scrollY||window.pageYOffset,se=h.bottom+ae,E=document.documentElement.scrollHeight-se;te(E>m?m:E),J(m)}},2e3);return(0,a.useEffect)(()=>{p&&!z&&(H.current?.play(),K(!0))},[p,z]),(0,a.useEffect)(()=>(g(),window.addEventListener("resize",g),()=>{window.removeEventListener("resize",g)}),[]),(0,a.useEffect)(()=>{function h(){const m=c?window.screen.height:window.innerHeight;G.default.timeline({scrollTrigger:{trigger:`#${t}`,start:"top top",end:`top+=${m*1.8}px bottom`,scrub:.5}}).from(`#${t} .media-content`,{top:"50%",transform:"translate(-50%, -50%)"}).to(`.${t} .sticky-cover`,{backdropFilter:"blur(8px)",duration:.4}).to(`#${t} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")}p&&h()},[p]),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{id:t,className:(0,u.cn)("relative z-20 h-screen w-full",r,{"aiui-dark":R==="dark","rounded-box":W==="rounded"}),ref:Z,children:(0,e.jsx)("div",{ref:A,className:"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased",style:{willChange:"transform",contain:"paint"},children:(0,e.jsx)(x,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)(B.default,{className:"sticky-title antialiased",data:{title:D||"",theme:R}})})})}),(0,e.jsxs)("div",{ref:w,style:{marginBottom:`-${ee}px`,zIndex:p?2:1},className:(0,u.cn)(t,"relative mt-[-200vh]",s),children:[(0,e.jsx)("div",{className:"sticky top-0 ",children:(0,e.jsxs)("div",{className:(0,u.cn)("media-cover","relative h-screen w-full"),children:[Q?(0,e.jsx)(Y.YouTubePlayer,{youTubeId:c&&O||M}):b?.url&&(0,e.jsx)(V.default,{videoRef:H,poster:c&&f?.url?f?.url:y?.url,src:c&&i?.url?i?.url:b?.url,className:"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]",videoClassName:" object-cover object-[82%]",muted:!0,loop:!1,playsInline:!0,onEnded:()=>{X(!0)}}),y?.url&&(!b?.url||U)&&(0,e.jsx)("img",{src:c&&f?.url?f?.url:y?.url,alt:y?.alt,className:"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]",loading:"lazy"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full",style:{backdropFilter:"blur(0px)",WebkitBackdropFilter:"blur(0px)",willChange:"backdrop-filter"}})]})}),(0,e.jsx)("div",{className:"relative h-screen w-full"}),(0,e.jsx)(me,{components:_}),(0,e.jsx)("div",{className:"relative h-screen w-full"})]})]})});var fe=(0,$.withLayout)(ue);
+"use strict";"use client";var oe=Object.create;var v=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var le=Object.getPrototypeOf,ce=Object.prototype.hasOwnProperty;var de=(r,s)=>{for(var t in s)v(r,t,{get:s[t],enumerable:!0})},S=(r,s,t,o)=>{if(s&&typeof s=="object"||typeof s=="function")for(let n of ie(s))!ce.call(r,n)&&n!==t&&v(r,n,{get:()=>s[n],enumerable:!(o=ne(s,n))||o.enumerable});return r};var l=(r,s,t)=>(t=r!=null?oe(le(r)):{},S(s||!r||!r.__esModule?v(t,"default",{value:r,enumerable:!0}):t,r)),pe=r=>S(v({},"__esModule",{value:!0}),r);var ye={};de(ye,{default:()=>fe});module.exports=pe(ye);var e=require("react/jsx-runtime"),a=l(require("react")),L=require("es-toolkit"),P=require("react-intersection-observer"),u=require("../../helpers/utils.js"),$=require("../../shared/Styles.js"),B=l(require("../Slogan/index.js")),Y=require("../VideoModal/YouTubePlayer.js"),d=require("../../components/grid.js"),q=require("../../components/container.js"),F=l(require("../BrandEquity/index.js")),I=l(require("../MemberEquity/index.js")),j=l(require("../Spacer/index.js")),G=l(require("gsap")),N=require("@payloadcms/richtext-lexical/html"),k=require("react-responsive"),V=l(require("../../helpers/ScrollLoadVideo.js"));const T=({defaultConverters:r})=>({...r,text:s=>{const{node:t}=s;return t.$&&t.$.color?`<span class="lexical-${t.$.color}">${t.text}</span>`:t.text}}),x=({children:r,spaceY:s,className:t})=>{const o=(0,k.useMediaQuery)({query:"(max-width: 768px)"});return(0,e.jsx)(q.Container,{spaceY:s,className:(0,u.cn)("!bg-transparent",t),children:(0,e.jsxs)(d.Grid,{children:[!o&&(0,e.jsx)(d.GridItem,{span:1}),(0,e.jsx)(d.GridItem,{span:o?12:10,children:r}),!o&&(0,e.jsx)(d.GridItem,{span:1})]})})},me=a.default.forwardRef(({children:r,id:s,components:t},o)=>{const n=(0,a.useRef)(null);return(0,e.jsxs)("div",{ref:n,className:"relative z-10",children:[(0,e.jsx)(e.Fragment,{children:r}),(0,e.jsx)(e.Fragment,{children:t?.map(i=>{switch(i.blockType){case"ipc-brand-equity":return(0,e.jsx)("div",{className:"relative z-20 bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(F.default,{data:i,style:i?.style})})});case"ipc-member-equity":return(0,e.jsx)("div",{className:"relative z-20 w-full bg-transparent",children:(0,e.jsx)(x,{spaceY:"none",children:(0,e.jsx)(I.default,{data:i,className:"w-full",style:i?.style})})});case"ipc-spacer":return(0,e.jsx)(j.default,{data:i,style:i?.style,className:"!bg-transparent"});default:return null}})})]})}),ue=(0,a.forwardRef)(({className:r="",wrapperClassName:s="",id:t,data:{title:o,videoTitle:n,mobVideo:i,mobImg:f,img:y,isYouTube:Q,youtubePcId:M,youtubeMobileId:O,video:b,theme:R,shape:W,components:_}},ve)=>{const H=(0,a.useRef)(null),w=(0,a.useRef)(null),{ref:A,inView:p}=(0,P.useInView)(),[be,J]=(0,a.useState)(0),[z,K]=(0,a.useState)(!1),[U,X]=(0,a.useState)(!1),Z=(0,a.useRef)(null),D=typeof o=="string"?o:o&&(0,N.convertLexicalToHTML)({data:o,converters:T});typeof n=="string"||n&&(0,N.convertLexicalToHTML)({data:n,converters:T});const[ee,te]=(0,a.useState)(0),[c,re]=(0,a.useState)(!1),C=(0,k.useMediaQuery)({query:"(max-width: 768px)"});(0,a.useEffect)(()=>{re(C)},[C]);const g=(0,L.debounce)(()=>{if(w.current){const h=w.current.getBoundingClientRect(),m=c?window.screen.height:window.innerHeight,ae=window.scrollY||window.pageYOffset,se=h.bottom+ae,E=document.documentElement.scrollHeight-se;te(E>m?m:E),J(m)}},2e3);return(0,a.useEffect)(()=>{p&&!z&&(H.current?.play(),K(!0))},[p,z]),(0,a.useEffect)(()=>(g(),window.addEventListener("resize",g),()=>{window.removeEventListener("resize",g)}),[]),(0,a.useEffect)(()=>{function h(){const m=c?window.screen.height:window.innerHeight;G.default.timeline({scrollTrigger:{trigger:`#${t}`,start:"top top",end:`top+=${m*1.8}px bottom`,scrub:.5}}).from(`#${t} .media-content`,{top:"50%",transform:"translate(-50%, -50%)"}).to(`.${t} .sticky-cover`,{backdropFilter:"blur(8px)",duration:.4}).to(`#${t} .media-content`,{top:"100%",transform:"translate(-50%, -100%)",duration:1},"<")}p&&h()},[p]),(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)("div",{id:t,className:(0,u.cn)("relative z-20 h-screen w-full",r,{"aiui-dark":R==="dark","rounded-box":W==="rounded"}),ref:Z,children:(0,e.jsx)("div",{ref:A,className:"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased",style:{willChange:"transform",contain:"paint"},children:(0,e.jsx)(x,{spaceY:"tablet:my-[32px] my-[24px] space-y-4",children:(0,e.jsx)(B.default,{className:"sticky-title antialiased",data:{title:D||"",theme:R}})})})}),(0,e.jsxs)("div",{ref:w,style:{marginBottom:`-${ee}px`,zIndex:p?2:1},className:(0,u.cn)(t,"relative mt-[-200vh]",s),children:[(0,e.jsx)("div",{className:"sticky top-0 ",children:(0,e.jsxs)("div",{className:(0,u.cn)("media-cover","relative h-screen w-full"),children:[Q?(0,e.jsx)(Y.YouTubePlayer,{youTubeId:c&&O||M}):b?.url&&(0,e.jsx)(V.default,{videoRef:H,poster:c&&f?.url?f?.url:y?.url,src:c&&i?.url?i?.url:b?.url,className:"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]",videoClassName:" object-cover object-[82%]",muted:!0,loop:!1,playsInline:!0,onEnded:()=>{X(!0)}}),y?.url&&(!b?.url||U)&&(0,e.jsx)("img",{src:c&&f?.url?f?.url:y?.url,alt:y?.alt,className:"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]",loading:"lazy"}),(0,e.jsx)("div",{className:"sticky-cover absolute left-0 top-0 z-10 size-full",style:{backdropFilter:"blur(0px)",WebkitBackdropFilter:"blur(0px)",willChange:"backdrop-filter"}})]})}),(0,e.jsx)("div",{className:"relative h-screen w-full"}),(0,e.jsx)(me,{components:_}),(0,e.jsx)("div",{className:"relative h-screen w-full"})]})]})});var fe=(0,$.withLayout)(ue);
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/MediaPlayerSticky/index.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect, forwardRef } from 'react'\nimport { debounce } from 'es-toolkit'\nimport { useInView } from 'react-intersection-observer'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { YouTubePlayer } from '../VideoModal/YouTubePlayer.js'\nimport { Grid, GridItem } from '../../components/gird.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({\n  children,\n  spaceY,\n  className,\n}: {\n  children: React.ReactNode\n  spaceY?: string\n  className?: string\n}) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY} className={cn('!bg-transparent', className)}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst SubBox = React.forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  {\n    children?: React.ReactNode\n    id?: string\n    components?: MediaPlayerComponent[]\n  }\n>(({ children, id, components }, ref) => {\n  const mediaPlayerStickyRef = useRef<HTMLDivElement>(null)\n\n  return (\n    <div ref={mediaPlayerStickyRef} className=\"relative z-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} className=\"!bg-transparent\" />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n})\n\nconst MediaPlayerSticky = forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  MediaPlayerBaseProps\n>(\n  (\n    {\n      className = '',\n      wrapperClassName = '',\n      id,\n      data: {\n        title,\n        videoTitle,\n        mobVideo,\n        mobImg,\n        img,\n        isYouTube,\n        youtubePcId,\n        youtubeMobileId,\n        video,\n        theme,\n        shape,\n        components,\n      },\n    },\n    ref\n  ) => {\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const boxRef = useRef<HTMLDivElement>(null)\n    const { ref: inViewRef, inView } = useInView()\n    const [screenHeight, setScreenHeight] = useState(0)\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [isEntered, setIsEntered] = useState(false)\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    typeof videoTitle === 'string'\n      ? videoTitle\n      : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    const [btb, setbtb] = useState(0)\n    const [isMobile, setIsMobile] = useState(false)\n    const mediaQuery = useMediaQuery({ query: '(max-width: 768px)' })\n\n    useEffect(() => {\n      setIsMobile(mediaQuery)\n    }, [mediaQuery])\n\n    const debouncedHandleResize = debounce(() => {\n      if (boxRef.current) {\n        const rect = boxRef.current.getBoundingClientRect()\n        const screenHeight = isMobile ? window.screen.height : window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n        setScreenHeight(screenHeight)\n      }\n    }, 2000)\n\n    useEffect(() => {\n      if (inView && !isPlaying) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      }\n    }, [inView, isPlaying])\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        const height = isMobile ? window.screen.height : window.innerHeight\n        gsap\n          .timeline({\n            scrollTrigger: {\n              trigger: `#${id}`,\n              start: 'top top',\n              end: `top+=${height * 1.8}px bottom`,\n              scrub: 0.5,\n            },\n          })\n          .from(`#${id} .media-content`, { top: '50%', transform: 'translate(-50%, -50%)' })\n          .to(`.${id} .sticky-cover`, {\n            backdropFilter: 'blur(8px)',\n            duration: 0.4,\n          })\n          .to(\n            `#${id} .media-content`,\n            {\n              top: '100%',\n              transform: 'translate(-50%, -100%)',\n              duration: 1,\n            },\n            '<'\n          )\n      }\n      if (inView) {\n        gsapResize()\n      }\n    }, [inView])\n\n    return (\n      <>\n        <div\n          id={id}\n          className={cn('relative z-20 h-screen w-full', className, {\n            'aiui-dark': theme === 'dark',\n            'rounded-box': shape === 'rounded',\n          })}\n          ref={wrapperRef}\n        >\n          <div\n            ref={inViewRef}\n            className=\"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased\"\n            style={{ willChange: 'transform', contain: 'paint' }}\n          >\n            <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n              <Slogan className=\"sticky-title antialiased\" data={{ title: title_html || '', theme }} />\n            </SubContainer>\n          </div>\n        </div>\n\n        <div\n          ref={boxRef}\n          style={{ marginBottom: `-${btb}px`, zIndex: inView ? 2 : 1 }}\n          className={cn(id, 'relative mt-[-200vh]', wrapperClassName)}\n        >\n          <div className=\"sticky top-0 \">\n            <div className={cn('media-cover', 'relative h-screen w-full')}>\n              {isYouTube ? (\n                <YouTubePlayer youTubeId={isMobile ? youtubeMobileId || youtubePcId : youtubePcId} />\n              ) : (\n                video?.url && (\n                  <ScrollLoadVideo\n                    videoRef={videoRef}\n                    poster={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                    src={isMobile && mobVideo?.url ? mobVideo?.url : video?.url}\n                    className=\"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]\"\n                    videoClassName=\" object-cover object-[82%]\"\n                    muted\n                    loop={false}\n                    playsInline\n                    onEnded={() => {\n                      setIsEntered(true)\n                    }}\n                  />\n                )\n              )}\n              {img?.url && (!video?.url || isEntered) && (\n                <img\n                  src={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                  alt={img?.alt}\n                  className=\"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]\"\n                  loading=\"lazy\"\n                />\n              )}\n              <div\n                className=\"sticky-cover absolute left-0 top-0 z-10 size-full\"\n                style={{\n                  backdropFilter: 'blur(0px)',\n                  WebkitBackdropFilter: 'blur(0px)',\n                  willChange: 'backdrop-filter',\n                }}\n              />\n            </div>\n          </div>\n\n          <div className=\"relative h-screen w-full\" />\n          <SubBox components={components}></SubBox>\n          <div className=\"relative h-screen w-full\" />\n        </div>\n      </>\n    )\n  }\n)\n\nexport default withLayout(MediaPlayerSticky)\n"],
+  "sourcesContent": ["'use client'\nimport React, { useState, useRef, useEffect, forwardRef } from 'react'\nimport { debounce } from 'es-toolkit'\nimport { useInView } from 'react-intersection-observer'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport Slogan from '../Slogan/index.js'\nimport { YouTubePlayer } from '../VideoModal/YouTubePlayer.js'\nimport { Grid, GridItem } from '../../components/grid.js'\nimport { Container } from '../../components/container.js'\nimport BrandEquity from '../BrandEquity/index.js'\nimport MemberEquity from '../MemberEquity/index.js'\nimport Spacer from '../Spacer/index.js'\nimport gsap from 'gsap'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\n\nimport type { HTMLConvertersFunction } from '@payloadcms/richtext-lexical/html'\n\nimport { useMediaQuery } from 'react-responsive'\nimport type { MediaPlayerBaseProps, MediaPlayerComponent } from './types.js'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\n\nconst htmlConverters: HTMLConvertersFunction = ({ defaultConverters }) => ({\n  ...defaultConverters,\n  text: args => {\n    const { node } = args\n\n    // \u68C0\u67E5\u662F\u5426\u6709\u81EA\u5B9A\u4E49 color\n    if (node.$ && node.$.color) {\n      return `<span class=\"lexical-${node.$.color}\">${node.text}</span>`\n    }\n    return node.text\n  },\n})\n\nconst SubContainer = ({\n  children,\n  spaceY,\n  className,\n}: {\n  children: React.ReactNode\n  spaceY?: string\n  className?: string\n}) => {\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  return (\n    <Container spaceY={spaceY} className={cn('!bg-transparent', className)}>\n      <Grid>\n        {!isMobile && <GridItem span={1} />}\n        <GridItem span={isMobile ? 12 : 10}>{children}</GridItem>\n        {!isMobile && <GridItem span={1} />}\n      </Grid>\n    </Container>\n  )\n}\n\nconst SubBox = React.forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  {\n    children?: React.ReactNode\n    id?: string\n    components?: MediaPlayerComponent[]\n  }\n>(({ children, id, components }, ref) => {\n  const mediaPlayerStickyRef = useRef<HTMLDivElement>(null)\n\n  return (\n    <div ref={mediaPlayerStickyRef} className=\"relative z-10\">\n      <>{children}</>\n      <>\n        {components?.map((componentData: any) => {\n          switch (componentData.blockType) {\n            case 'ipc-brand-equity': {\n              return (\n                <div className=\"relative z-20 bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <BrandEquity data={componentData} style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-member-equity': {\n              return (\n                <div className=\"relative z-20 w-full bg-transparent\">\n                  <SubContainer spaceY=\"none\">\n                    <MemberEquity data={componentData} className=\"w-full\" style={componentData?.style} />\n                  </SubContainer>\n                </div>\n              )\n            }\n            case 'ipc-spacer': {\n              return <Spacer data={componentData} style={componentData?.style} className=\"!bg-transparent\" />\n            }\n            default:\n              return null\n          }\n        })}\n      </>\n    </div>\n  )\n})\n\nconst MediaPlayerSticky = forwardRef<\n  {\n    mediaPlayerStickyRef: HTMLDivElement\n  },\n  MediaPlayerBaseProps\n>(\n  (\n    {\n      className = '',\n      wrapperClassName = '',\n      id,\n      data: {\n        title,\n        videoTitle,\n        mobVideo,\n        mobImg,\n        img,\n        isYouTube,\n        youtubePcId,\n        youtubeMobileId,\n        video,\n        theme,\n        shape,\n        components,\n      },\n    },\n    ref\n  ) => {\n    const videoRef = useRef<HTMLVideoElement>(null)\n    const boxRef = useRef<HTMLDivElement>(null)\n    const { ref: inViewRef, inView } = useInView()\n    const [screenHeight, setScreenHeight] = useState(0)\n    const [isPlaying, setIsPlaying] = useState(false)\n    const [isEntered, setIsEntered] = useState(false)\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    const title_html =\n      typeof title === 'string' ? title : title && convertLexicalToHTML({ data: title, converters: htmlConverters })\n    typeof videoTitle === 'string'\n      ? videoTitle\n      : videoTitle && convertLexicalToHTML({ data: videoTitle, converters: htmlConverters })\n\n    const [btb, setbtb] = useState(0)\n    const [isMobile, setIsMobile] = useState(false)\n    const mediaQuery = useMediaQuery({ query: '(max-width: 768px)' })\n\n    useEffect(() => {\n      setIsMobile(mediaQuery)\n    }, [mediaQuery])\n\n    const debouncedHandleResize = debounce(() => {\n      if (boxRef.current) {\n        const rect = boxRef.current.getBoundingClientRect()\n        const screenHeight = isMobile ? window.screen.height : window.innerHeight\n        const scrollTop = window.scrollY || window.pageYOffset\n        const elementBottomToPageTop = rect.bottom + scrollTop\n        const pageHeight = document.documentElement.scrollHeight\n        const distanceToPageBottom = pageHeight - elementBottomToPageTop\n        setbtb(distanceToPageBottom > screenHeight ? screenHeight : distanceToPageBottom)\n        setScreenHeight(screenHeight)\n      }\n    }, 2000)\n\n    useEffect(() => {\n      if (inView && !isPlaying) {\n        videoRef.current?.play()\n        setIsPlaying(true)\n      }\n    }, [inView, isPlaying])\n\n    useEffect(() => {\n      debouncedHandleResize()\n      window.addEventListener('resize', debouncedHandleResize)\n      return () => {\n        window.removeEventListener('resize', debouncedHandleResize)\n      }\n    }, [])\n\n    useEffect(() => {\n      function gsapResize() {\n        const height = isMobile ? window.screen.height : window.innerHeight\n        gsap\n          .timeline({\n            scrollTrigger: {\n              trigger: `#${id}`,\n              start: 'top top',\n              end: `top+=${height * 1.8}px bottom`,\n              scrub: 0.5,\n            },\n          })\n          .from(`#${id} .media-content`, { top: '50%', transform: 'translate(-50%, -50%)' })\n          .to(`.${id} .sticky-cover`, {\n            backdropFilter: 'blur(8px)',\n            duration: 0.4,\n          })\n          .to(\n            `#${id} .media-content`,\n            {\n              top: '100%',\n              transform: 'translate(-50%, -100%)',\n              duration: 1,\n            },\n            '<'\n          )\n      }\n      if (inView) {\n        gsapResize()\n      }\n    }, [inView])\n\n    return (\n      <>\n        <div\n          id={id}\n          className={cn('relative z-20 h-screen w-full', className, {\n            'aiui-dark': theme === 'dark',\n            'rounded-box': shape === 'rounded',\n          })}\n          ref={wrapperRef}\n        >\n          <div\n            ref={inViewRef}\n            className=\"media-content translate-z-0 absolute left-1/2 top-1/2 z-10 w-full -translate-x-1/2 -translate-y-1/2 antialiased\"\n            style={{ willChange: 'transform', contain: 'paint' }}\n          >\n            <SubContainer spaceY=\"tablet:my-[32px] my-[24px] space-y-4\">\n              <Slogan className=\"sticky-title antialiased\" data={{ title: title_html || '', theme }} />\n            </SubContainer>\n          </div>\n        </div>\n\n        <div\n          ref={boxRef}\n          style={{ marginBottom: `-${btb}px`, zIndex: inView ? 2 : 1 }}\n          className={cn(id, 'relative mt-[-200vh]', wrapperClassName)}\n        >\n          <div className=\"sticky top-0 \">\n            <div className={cn('media-cover', 'relative h-screen w-full')}>\n              {isYouTube ? (\n                <YouTubePlayer youTubeId={isMobile ? youtubeMobileId || youtubePcId : youtubePcId} />\n              ) : (\n                video?.url && (\n                  <ScrollLoadVideo\n                    videoRef={videoRef}\n                    poster={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                    src={isMobile && mobVideo?.url ? mobVideo?.url : video?.url}\n                    className=\"lg-desktop:aspect-w-[1920] lg-desktop:aspect-h-[930] lg:aspect-w-[1440] lg:aspect-h-[700] desktop:aspect-w-[1024] desktop:aspect-h-[520] tablet:aspect-w-[768] tablet:aspect-h-[660] aspect-w-[390] aspect-h-[660]\"\n                    videoClassName=\" object-cover object-[82%]\"\n                    muted\n                    loop={false}\n                    playsInline\n                    onEnded={() => {\n                      setIsEntered(true)\n                    }}\n                  />\n                )\n              )}\n              {img?.url && (!video?.url || isEntered) && (\n                <img\n                  src={isMobile && mobImg?.url ? mobImg?.url : img?.url}\n                  alt={img?.alt}\n                  className=\"z-1 absolute left-0 top-0 size-full object-cover  object-[82%]\"\n                  loading=\"lazy\"\n                />\n              )}\n              <div\n                className=\"sticky-cover absolute left-0 top-0 z-10 size-full\"\n                style={{\n                  backdropFilter: 'blur(0px)',\n                  WebkitBackdropFilter: 'blur(0px)',\n                  willChange: 'backdrop-filter',\n                }}\n              />\n            </div>\n          </div>\n\n          <div className=\"relative h-screen w-full\" />\n          <SubBox components={components}></SubBox>\n          <div className=\"relative h-screen w-full\" />\n        </div>\n      </>\n    )\n  }\n)\n\nexport default withLayout(MediaPlayerSticky)\n"],
   "mappings": "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",
-  "names": ["MediaPlayerSticky_exports", "__export", "MediaPlayerSticky_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_es_toolkit", "import_react_intersection_observer", "import_utils", "import_Styles", "import_Slogan", "import_YouTubePlayer", "import_gird", "import_container", "import_BrandEquity", "import_MemberEquity", "import_Spacer", "import_gsap", "import_html", "import_react_responsive", "import_ScrollLoadVideo", "htmlConverters", "defaultConverters", "args", "node", "SubContainer", "children", "spaceY", "className", "isMobile", "SubBox", "React", "id", "components", "ref", "mediaPlayerStickyRef", "componentData", "BrandEquity", "MemberEquity", "Spacer", "MediaPlayerSticky", "wrapperClassName", "title", "videoTitle", "mobVideo", "mobImg", "img", "isYouTube", "youtubePcId", "youtubeMobileId", "video", "theme", "shape", "videoRef", "boxRef", "inViewRef", "inView", "screenHeight", "setScreenHeight", "isPlaying", "setIsPlaying", "isEntered", "setIsEntered", "wrapperRef", "title_html", "btb", "setbtb", "setIsMobile", "mediaQuery", "debouncedHandleResize", "rect", "scrollTop", "elementBottomToPageTop", "distanceToPageBottom", "gsapResize", "height", "gsap", "Slogan", "ScrollLoadVideo"]
+  "names": ["MediaPlayerSticky_exports", "__export", "MediaPlayerSticky_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_es_toolkit", "import_react_intersection_observer", "import_utils", "import_Styles", "import_Slogan", "import_YouTubePlayer", "import_grid", "import_container", "import_BrandEquity", "import_MemberEquity", "import_Spacer", "import_gsap", "import_html", "import_react_responsive", "import_ScrollLoadVideo", "htmlConverters", "defaultConverters", "args", "node", "SubContainer", "children", "spaceY", "className", "isMobile", "SubBox", "React", "id", "components", "ref", "mediaPlayerStickyRef", "componentData", "BrandEquity", "MemberEquity", "Spacer", "MediaPlayerSticky", "wrapperClassName", "title", "videoTitle", "mobVideo", "mobImg", "img", "isYouTube", "youtubePcId", "youtubeMobileId", "video", "theme", "shape", "videoRef", "boxRef", "inViewRef", "inView", "screenHeight", "setScreenHeight", "isPlaying", "setIsPlaying", "isEntered", "setIsEntered", "wrapperRef", "title_html", "btb", "setbtb", "setIsMobile", "mediaQuery", "debouncedHandleResize", "rect", "scrollTop", "elementBottomToPageTop", "distanceToPageBottom", "gsapResize", "height", "gsap", "Slogan", "ScrollLoadVideo"]
 }

package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var Z=Object.create;var V=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames;var K=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var X=(a,l)=>{for(var o in l)V(a,o,{get:l[o],enumerable:!0})},H=(a,l,o,c)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of J(l))!W.call(a,i)&&i!==o&&V(a,i,{get:()=>l[i],enumerable:!(c=F(l,i))||c.enumerable});return a};var P=(a,l,o)=>(o=a!=null?Z(K(a)):{},H(l||!a||!a.__esModule?V(o,"default",{value:a,enumerable:!0}):o,a)),ee=a=>H(V({},"__esModule",{value:!0}),a);var ae={};X(ae,{default:()=>te});module.exports=ee(ae);var e=require("react/jsx-runtime"),r=P(require("react")),D=require("react-responsive"),Q=require("../../shared/Styles.js"),S=P(require("../../components/picture.js")),z=P(require("../../components/button.js")),R=require("../../components/heading.js"),Y=require("../VideoModal/index.js"),N=require("../../components/gird.js"),q=P(require("../Title/index.js")),m=require("../../helpers/utils.js"),C=P(require("../SwiperBox/index.js")),U=require("../../shared/mimeType.js"),g=require("../../components/tabs.js"),A=require("../../hooks/useExposure.js"),L=require("../../shared/trackUrlRef.js"),O=require("../../shared/track.js");const b="image",w="p1_banner",$=({data:a,configuration:l,jIndex:o,spanType:c,title:i,onSecondaryButtonClick:d,onPrimaryButtonClick:x})=>{const[B,k]=(0,r.useState)(!1),T=(0,D.useMediaQuery)({query:"(max-width: 768px)"}),M=(0,r.useRef)(null),I=()=>{if(c)switch(c){case"full":return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case"half":return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case"one-third":return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}else switch(l?.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}};(0,A.useExposure)(M,{componentType:b,componentName:w,position:o,componentTitle:a.title,componentDescription:a.description,navigation:l?.activeTab}),(0,r.useEffect)(()=>{k(T)},[T]);const{theme:G="light",title:h,description:f,imageUrl:n,primaryButton:u,secondaryButton:p,imageMobileUrl:y,blockLink:v,video:t,youtubeId:s,isYouTube:_}=a,E="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,m.cn)("item-wrapper cursor-pointer","text-info-primary group relative box-border w-full overflow-hidden",I(),{"rounded-2xl":l?.shape==="rounded","aiui-dark":G==="dark","h-[400px]":B},"text-info-primary"),ref:M,children:[(v||p.link)&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,L.trackUrlRef)(v||p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,"aria-hidden":"true",tabIndex:-1}),(0,e.jsxs)("div",{className:"absolute inset-0",children:[(0,U.isVideo)(n?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block hidden size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:n?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:n?.url,alt:n?.alt||"",className:"tablet:block hidden h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${n?.width}/${n?.height}`}}),(0,U.isVideo)(y?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden block size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:y?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:y?.url||n?.url,alt:y?.alt||n?.alt||"",className:"tablet:hidden block h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 object-cover"}),(0,e.jsxs)("div",{className:(0,m.cn)("absolutestyle laptop:p-6 desktop:p-[32px] laptop:gap-4 desktop:gap-6 absolute inset-x-0 bottom-0 z-20 flex w-fit flex-col gap-6 p-4",{"fullstyle laptop:top-1/2 laptop:-translate-y-1/2 laptop:bottom-auto":a?.width==="full"}),children:[(0,e.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,e.jsx)(R.Heading,{size:3,as:"h3",className:"item-title",html:h}),(0,e.jsx)(R.Heading,{as:"h4",className:"item-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-1 text-[14px]",html:f})]}),(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex gap-2",children:[p&&p.text&&(0,e.jsxs)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-left"),variant:"secondary",as:"a",onClick:()=>{d?.(a)},href:(0,L.trackUrlRef)(p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${p.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:[p.text,(0,e.jsx)("span",{className:"sr-only",children:h??f})]}),u&&u.text&&(0,e.jsx)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-right"),variant:"primary",as:"a",onClick:()=>{x?.(a)},href:(0,L.trackUrlRef)(u.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${u.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:u.text})]})]})]}),(0,e.jsx)("div",{children:(0,e.jsx)("div",{className:"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4 z-20",children:(t?.url||s)&&(0,e.jsx)("button",{onClick:()=>{l?.onVideoPlayBtnClick?.(t?.url||s,_)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white bg-opacity-20 hover:bg-black/75",children:(0,e.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})})})})]})},j=r.default.forwardRef((a,l)=>{const{onSecondaryButtonClick:o,onPrimaryButtonClick:c}=a,{shape:i,sectionTitle:d,groupByTab:x=!1,items:B=[],carousel:k}=a.data,[T,M]=(0,r.useState)(!1),[I,G]=(0,r.useState)(""),[h,f]=(0,r.useState)(""),n=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},u=B.map(t=>t.tabName).filter(Boolean).filter((t,s,_)=>_.indexOf(t)===s),p=(t,s)=>{M(!0),s?f?.(t||""):G?.(t||"")},y=(t,s)=>{switch(t){case 1:return 1;case 2:return 2;default:return s?2.3:3}},v=u.map(t=>({tabName:t,items:B.filter(s=>s.tabName===t)})).reduce((t,s)=>(t[s.tabName]=s.items,t),{});return(0,e.jsxs)("section",{"data-ui-component-id":"MultiLayoutGraphicBlock",ref:l,className:(0,m.cn)("multiLayoutGraphicBlock","text-info-primary",a.className),children:[d&&(0,e.jsx)(q.default,{data:{title:d},className:"section-title"}),x?(0,e.jsxs)(g.Tabs,{shape:i,align:"left",defaultValue:(0,m.spaceToHyphen)(u[0]),children:[(0,e.jsx)(g.TabsList,{children:u.map((t,s)=>(0,e.jsx)(g.TabsTrigger,{value:(0,m.spaceToHyphen)(t),onClick:()=>{(0,O.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:b,component_name:w,component_title:d,component_position:1,navigation:t,button_name:t}})},children:t},s))}),u.map((t,s)=>(0,e.jsx)(g.TabsContent,{value:(0,m.spaceToHyphen)(t),className:"desktop:mt-[36px] mt-[24px] w-full",children:(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock1",data:{list:v?.[t]||[],configuration:{shape:i,isTab:x,activeTab:t,title:d,num:v?.[t]?.length||0,onVideoPlayBtnClick:p,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0,!0)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0)}}}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock2",data:{list:k?.items||[],configuration:{shape:i,isTab:x,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]})},s))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(N.Grid,{className:"w-full",children:[B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:t.width,onSecondaryButtonClick:o,onPrimaryButtonClick:c})},`${t?.title||""}${s}`)),B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n("full"),className:"laptop:hidden block",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:"full"})},`${t?.title||""}${s}`))]}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock3",data:{list:k?.items||[],configuration:{shape:i,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]}),T&&(0,e.jsx)(Y.VideoModal,{visible:T,youTubeId:h,videoUrl:I,onCloseModal:()=>M(!1)})]})});j.displayName="MultiLayoutGraphicBlock";var te=(0,Q.withLayout)(j);
+"use strict";var Z=Object.create;var V=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var J=Object.getOwnPropertyNames;var K=Object.getPrototypeOf,W=Object.prototype.hasOwnProperty;var X=(a,l)=>{for(var o in l)V(a,o,{get:l[o],enumerable:!0})},H=(a,l,o,c)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of J(l))!W.call(a,i)&&i!==o&&V(a,i,{get:()=>l[i],enumerable:!(c=F(l,i))||c.enumerable});return a};var P=(a,l,o)=>(o=a!=null?Z(K(a)):{},H(l||!a||!a.__esModule?V(o,"default",{value:a,enumerable:!0}):o,a)),ee=a=>H(V({},"__esModule",{value:!0}),a);var ae={};X(ae,{default:()=>te});module.exports=ee(ae);var e=require("react/jsx-runtime"),r=P(require("react")),D=require("react-responsive"),Q=require("../../shared/Styles.js"),S=P(require("../../components/picture.js")),z=P(require("../../components/button.js")),R=require("../../components/heading.js"),Y=require("../VideoModal/index.js"),N=require("../../components/grid.js"),q=P(require("../Title/index.js")),m=require("../../helpers/utils.js"),C=P(require("../SwiperBox/index.js")),U=require("../../shared/mimeType.js"),g=require("../../components/tabs.js"),A=require("../../hooks/useExposure.js"),L=require("../../shared/trackUrlRef.js"),O=require("../../shared/track.js");const b="image",w="p1_banner",$=({data:a,configuration:l,jIndex:o,spanType:c,title:i,onSecondaryButtonClick:d,onPrimaryButtonClick:x})=>{const[B,k]=(0,r.useState)(!1),T=(0,D.useMediaQuery)({query:"(max-width: 768px)"}),M=(0,r.useRef)(null),I=()=>{if(c)switch(c){case"full":return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case"half":return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case"one-third":return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}else switch(l?.num){case 1:return"tablet:aspect-w-[704] tablet:aspect-h-[400] laptop:aspect-w-[896] laptop:aspect-h-[384] desktop:aspect-w-[1312] desktop:aspect-h-[512] lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[640]";case 2:return"tablet:aspect-w-[704] tablet:aspect-h-[480] laptop:aspect-w-[440] laptop:aspect-h-[384] desktop:aspect-w-[648] desktop:aspect-h-[512] lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[640]";case 3:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]";default:return"tablet:aspect-w-[296] tablet:aspect-h-[400] laptop:aspect-w-[288] laptop:aspect-h-[384] desktop:aspect-w-[427] desktop:aspect-h-[512] lg-desktop:aspect-w-[544] lg-desktop:aspect-h-[640]"}};(0,A.useExposure)(M,{componentType:b,componentName:w,position:o,componentTitle:a.title,componentDescription:a.description,navigation:l?.activeTab}),(0,r.useEffect)(()=>{k(T)},[T]);const{theme:G="light",title:h,description:f,imageUrl:n,primaryButton:u,secondaryButton:p,imageMobileUrl:y,blockLink:v,video:t,youtubeId:s,isYouTube:_}=a,E="lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px]";return(0,e.jsxs)("div",{className:(0,m.cn)("item-wrapper cursor-pointer","text-info-primary group relative box-border w-full overflow-hidden",I(),{"rounded-2xl":l?.shape==="rounded","aiui-dark":G==="dark","h-[400px]":B},"text-info-primary"),ref:M,children:[(v||p.link)&&(0,e.jsx)("a",{className:"absolute inset-0 z-10",href:(0,L.trackUrlRef)(v||p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,"aria-hidden":"true",tabIndex:-1}),(0,e.jsxs)("div",{className:"absolute inset-0",children:[(0,U.isVideo)(n?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:block hidden size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:n?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:n?.url,alt:n?.alt||"",className:"tablet:block hidden h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 group-hover:scale-105 object-cover",style:{aspectRatio:`${n?.width}/${n?.height}`}}),(0,U.isVideo)(y?.mimeType)?(0,e.jsx)("video",{autoPlay:!0,muted:!0,playsInline:!0,loop:!0,className:"tablet:hidden block size-full overflow-hidden object-cover",children:(0,e.jsx)("source",{src:y?.url,type:"video/mp4"})}):(0,e.jsx)(S.default,{source:y?.url||n?.url,alt:y?.alt||n?.alt||"",className:"tablet:hidden block h-full overflow-hidden",imgClassName:"h-full transition-all duration-300 object-cover"}),(0,e.jsxs)("div",{className:(0,m.cn)("absolutestyle laptop:p-6 desktop:p-[32px] laptop:gap-4 desktop:gap-6 absolute inset-x-0 bottom-0 z-20 flex w-fit flex-col gap-6 p-4",{"fullstyle laptop:top-1/2 laptop:-translate-y-1/2 laptop:bottom-auto":a?.width==="full"}),children:[(0,e.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,e.jsx)(R.Heading,{size:3,as:"h3",className:"item-title",html:h}),(0,e.jsx)(R.Heading,{as:"h4",className:"item-description desktop:text-[16px] lg-desktop:text-[18px] line-clamp-1 text-[14px]",html:f})]}),(0,e.jsxs)("div",{className:"lg-desktop:gap-3 flex gap-2",children:[p&&p.text&&(0,e.jsxs)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-left"),variant:"secondary",as:"a",onClick:()=>{d?.(a)},href:(0,L.trackUrlRef)(p.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${p.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:[p.text,(0,e.jsx)("span",{className:"sr-only",children:h??f})]}),u&&u.text&&(0,e.jsx)(z.default,{"aria-label":h??f,className:(0,m.cn)(E,"link-right"),variant:"primary",as:"a",onClick:()=>{x?.(a)},href:(0,L.trackUrlRef)(u.link,`${b}_${w}`),"data-headless-type-name":`${b}#${w}`,"data-headless-title-desc-button":`${h}#${f}#${u.text}`,"data-headless-nav-postion":`${l?.activeTab}#${o}`,children:u.text})]})]})]}),(0,e.jsx)("div",{children:(0,e.jsx)("div",{className:"laptop:bottom-6 laptop:right-6 absolute bottom-4 right-4 z-20",children:(t?.url||s)&&(0,e.jsx)("button",{onClick:()=>{l?.onVideoPlayBtnClick?.(t?.url||s,_)},className:"laptop:size-12 flex size-8 items-center justify-center rounded-full bg-white bg-opacity-20 hover:bg-black/75",children:(0,e.jsx)("svg",{width:"12",height:"14",viewBox:"0 0 12 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,e.jsx)("path",{d:"M12 7L0 14L0 0L12 7Z",fill:"white"})})})})})]})},j=r.default.forwardRef((a,l)=>{const{onSecondaryButtonClick:o,onPrimaryButtonClick:c}=a,{shape:i,sectionTitle:d,groupByTab:x=!1,items:B=[],carousel:k}=a.data,[T,M]=(0,r.useState)(!1),[I,G]=(0,r.useState)(""),[h,f]=(0,r.useState)(""),n=t=>{switch(t){case"full":return 12;case"half":return 6;case"one-third":return 4}},u=B.map(t=>t.tabName).filter(Boolean).filter((t,s,_)=>_.indexOf(t)===s),p=(t,s)=>{M(!0),s?f?.(t||""):G?.(t||"")},y=(t,s)=>{switch(t){case 1:return 1;case 2:return 2;default:return s?2.3:3}},v=u.map(t=>({tabName:t,items:B.filter(s=>s.tabName===t)})).reduce((t,s)=>(t[s.tabName]=s.items,t),{});return(0,e.jsxs)("section",{"data-ui-component-id":"MultiLayoutGraphicBlock",ref:l,className:(0,m.cn)("multiLayoutGraphicBlock","text-info-primary",a.className),children:[d&&(0,e.jsx)(q.default,{data:{title:d},className:"section-title"}),x?(0,e.jsxs)(g.Tabs,{shape:i,align:"left",defaultValue:(0,m.spaceToHyphen)(u[0]),children:[(0,e.jsx)(g.TabsList,{children:u.map((t,s)=>(0,e.jsx)(g.TabsTrigger,{value:(0,m.spaceToHyphen)(t),onClick:()=>{(0,O.gaTrack)({event:"ga4Event",event_name:"component_click",event_parameters:{page_group:"Home Page",component_type:b,component_name:w,component_title:d,component_position:1,navigation:t,button_name:t}})},children:t},s))}),u.map((t,s)=>(0,e.jsx)(g.TabsContent,{value:(0,m.spaceToHyphen)(t),className:"desktop:mt-[36px] mt-[24px] w-full",children:(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock1",data:{list:v?.[t]||[],configuration:{shape:i,isTab:x,activeTab:t,title:d,num:v?.[t]?.length||0,onVideoPlayBtnClick:p,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0,!0)},1024:{spaceBetween:16,freeMode:!1,slidesPerView:y(v?.[t]?.length||0)}}}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock2",data:{list:k?.items||[],configuration:{shape:i,isTab:x,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]})},s))]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsxs)(N.Grid,{className:"w-full",children:[B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n(t.width??"full"),className:"laptop:block hidden",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:t.width,onSecondaryButtonClick:o,onPrimaryButtonClick:c})},`${t?.title||""}${s}`)),B.map((t,s)=>(0,e.jsx)(N.GridItem,{span:n("full"),className:"laptop:hidden block",children:(0,e.jsx)($,{data:t,configuration:{shape:i,onVideoPlayBtnClick:p,title:d},jIndex:s,spanType:"full"})},`${t?.title||""}${s}`))]}),k&&k?.items.length>0?(0,e.jsx)(C.default,{className:"!overflow-visible",id:"MultiLayoutGraphicBlock3",data:{list:k?.items||[],configuration:{shape:i,onVideoPlayBtnClick:p,title:d,onSecondaryButtonClick:o,onPrimaryButtonClick:c}},Slide:$,breakpoints:{0:{spaceBetween:12,freeMode:!1,slidesPerView:1},374:{spaceBetween:12,freeMode:!1,slidesPerView:1.2},768:{spaceBetween:16,freeMode:!1,slidesPerView:2.3},1024:{spaceBetween:16,freeMode:!1,slidesPerView:3.1},1440:{spaceBetween:16,freeMode:!1,slidesPerView:4}}}):null]}),T&&(0,e.jsx)(Y.VideoModal,{visible:T,youTubeId:h,videoUrl:I,onCloseModal:()=>M(!1)})]})});j.displayName="MultiLayoutGraphicBlock";var te=(0,Q.withLayout)(j);
 //# sourceMappingURL=MultiLayoutGraphicBlock.js.map