@anker-in/headless-ui 1.0.26-alpha.1762163448499 → 1.0.26-alpha.1762243303200

package/dist/cjs/biz-components/TabsWithMedia/TabsWithMedia.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/TabsWithMedia/TabsWithMedia.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { TabsWithMediaProps, TabItem, TimeIndex } from './types.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Pagination, EffectFade } from 'swiper/modules'\nimport type { Swiper as SwiperType } from 'swiper'\nimport { motion, AnimatePresence } from 'framer-motion'\nimport { useMediaQuery } from 'react-responsive'\n\nconst componentType = 'video'\nconst componentName = 'tabs_with_media'\n\n// \u9ED8\u8BA4\u65F6\u95F4\u70B9\u914D\u7F6E\nconst defaultTimeIdx: TimeIndex[] = [\n  { time: 2.4, point: 2.4, highlightIdx: 0 },\n  { time: 2.5, point: 4.9, highlightIdx: 1 },\n  { time: 2.5, point: 7.4, highlightIdx: 2 },\n  { time: 2.8, point: 10.2, highlightIdx: 3 },\n  { time: 2.6, point: 12.8, highlightIdx: 4 },\n  { time: 3.2, point: 16, highlightIdx: 5 },\n]\n\nconst TabsWithMedia = React.forwardRef<HTMLDivElement, TabsWithMediaProps>(({ data, className }, ref) => {\n  const { title, poster, video, mobvideo, items = [], timeIdx = defaultTimeIdx } = data\n\n  const [swiper, setSwiper] = useState<SwiperType | null>(null)\n  const tabRefs = useRef<(HTMLDivElement | null)[]>([])\n  const scrollContainerRef = useRef<HTMLDivElement>(null)\n  const videoRef = useRef<HTMLVideoElement>(null)\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  const scrollToTabCenter = (index: number) => {\n    const container = scrollContainerRef.current\n    const tab = tabRefs.current[index]\n\n    if (container && tab) {\n      const containerRect = container.getBoundingClientRect()\n      const tabRect = tab.getBoundingClientRect()\n      const offset = tabRect.left - containerRect.left\n      const scroll = offset - container.clientWidth / 2 + tab.clientWidth / 2\n\n      container.scrollTo({\n        left: container.scrollLeft + scroll,\n        behavior: 'smooth',\n      })\n    }\n  }\n\n  const isMob = useMediaQuery({ query: '(max-width: 768px)' })\n\n  const [list, listDouble, row, center, listLength] = useMemo(() => {\n    const row = 5\n    const center = 2\n    const listLength = items.length\n\n    const list =\n      items?.map((item: TabItem, index: number) => {\n        return {\n          ...item,\n          key: index,\n          index: index,\n        }\n      }) || []\n\n    return [list, list.concat(list), row, center, listLength]\n  }, [items, isMob])\n\n  const [idx, setIdx] = useState(center)\n\n  const [cureentList, setCureentList] = useState(listDouble.slice(0, row))\n\n  // \u70B9\u51FB tab \u8DF3\u8F6C\u5BF9\u5E94\u89C6\u9891\u4F4D\u7F6E\n  const handleNavClick = (key: number, index: number, isAuto?: boolean) => {\n    if (key === idx) return\n    if (index === center) return\n    if (index > center) {\n      const gap = index - center\n      const copy = [...cureentList]\n      copy.splice(0, gap)\n      const lastkey = (cureentList[cureentList.length - 1] as any)?.key + 1\n      const add = [...listDouble].splice(lastkey, gap)\n      copy.push(...add)\n      setCureentList([...copy])\n    }\n    if (index < center) {\n      const gap = center - index\n      const copy = [...cureentList]\n      copy.splice(-gap)\n      const firstkey = (cureentList[0] as any)?.key\n      const add = [...listDouble].splice(listLength + firstkey - gap, gap)\n      copy.unshift(...add)\n      setCureentList([...copy])\n    }\n\n    setIdx(key)\n    swiper?.slideTo(key)\n\n    if (!isAuto) {\n      let time = 0\n      timeIdx.forEach(item => {\n        if (item.highlightIdx < key) {\n          time += item.time\n        }\n      })\n      if (videoRef.current) {\n        videoRef.current.currentTime = time\n      }\n    }\n  }\n\n  // \u64AD\u653E\u65F6\u6839\u636E\u65F6\u95F4\u5207\u6362 Swiper + tab\n  useEffect(() => {\n    const video = videoRef.current\n    if (!video) return\n\n    const handleTimeUpdate = () => {\n      const currentTime = video.currentTime\n\n      // \u81EA\u52A8\u5207\u6362\u5185\u5BB9\n      for (let i = 0; i < timeIdx.length; i++) {\n        const prev = i === 0 ? 0 : timeIdx[i - 1].point\n        if (currentTime >= prev && currentTime < timeIdx[i].point) {\n          handleNavClick(timeIdx[i].highlightIdx, timeIdx[i].highlightIdx, true)\n          break\n        }\n      }\n\n      // \u4FEE\u590D\uFF1A\u64AD\u653E\u5230\u6700\u540E\u540E\u81EA\u52A8\u5F52\u96F6\u5E76\u91CD\u65B0\u64AD\u653E\n      if (currentTime >= timeIdx[timeIdx.length - 1].point) {\n        video.currentTime = 0\n        video.play()\n      }\n    }\n\n    video.addEventListener('timeupdate', handleTimeUpdate)\n    return () => {\n      video.removeEventListener('timeupdate', handleTimeUpdate)\n    }\n  }, [swiper, timeIdx])\n\n  return (\n    <section\n      ref={boxRef}\n      data-ui-component-id=\"TabsWithMedia\"\n      className={cn('flex flex-col overflow-hidden text-[#fff] sm:overflow-visible', className)}\n    >\n      <Heading as=\"h3\" size={4} html={title} className=\"text-center\" />\n      <div className=\" relative w-full overflow-x-auto scrollbar-hidden sm:overflow-visible\">\n        <div className={cn('mx-auto mt-[16px] w-full max-w-[824px] tablet:w-fit')}>\n          <div\n            className={cn('flex translate-x-0 items-center justify-center gap-[16px] transition-all md:gap-[8px]')}\n            ref={scrollContainerRef}\n          >\n            <AnimatePresence mode=\"popLayout\">\n              {cureentList?.map((item: any, index: number) => (\n                <motion.div\n                  layout\n                  key={item?.key}\n                  ref={el => {\n                    tabRefs.current[item?.index] = el\n                  }}\n                  onClick={() => {\n                    handleNavClick(item?.key, index)\n                  }}\n                  className=\"min-w-[28px] flex-none cursor-pointer overflow-hidden sm:overflow-visible\"\n                  initial={{ opacity: 1 }}\n                  animate={{ opacity: 1 }}\n                  exit={{ opacity: 0 }}\n                  transition={{\n                    duration: 0.3,\n                    ease: 'easeOut',\n                  }}\n                >\n                  <div className=\"flex items-center justify-between\">\n                    <div\n                      className={cn('flex', {\n                        'flex items-center justify-center gap-[8px] rounded-[48px] bg-[#fff] p-2 md:gap-[4px] md:p-1':\n                          idx === item?.key,\n                      })}\n                    >\n                      <div\n                        className={cn(\n                          'flex h-[28] w-[28] items-center justify-center rounded-full md:flex-shrink-0 lg-desktop:h-[48px] lg-desktop:w-[48px]',\n                          {\n                            'h-[28px] w-[28px] bg-[#ccc] bg-opacity-50 lg-desktop:h-[48px] lg-desktop:w-[48px]':\n                              idx !== item?.index,\n                          }\n                        )}\n                        style={\n                          idx === item?.key\n                            ? {\n                                background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n                              }\n                            : undefined\n                        }\n                      >\n                        <Picture\n                          source={item?.icon?.url}\n                          alt={item?.icon?.alt}\n                          className=\"h-[22px] w-[22px] md:h-[14px] md:w-[14px]\"\n                        />\n                      </div>\n\n                      <div className=\"\">\n                        <Heading\n                          as=\"h4\"\n                          size={2}\n                          html={item?.tab}\n                          className={cn(\n                            'dynamic-width-heading line-clamp-1 h-0 w-0 overflow-hidden whitespace-nowrap text-nowrap text-[#000] opacity-0 transition-all duration-300 ease-linear xs:text-[16px] sm:text-[18px]',\n                            {\n                              'h-auto w-[calc-size(auto,size)] px-[6px] opacity-100': idx === item?.key,\n                            }\n                          )}\n                        />\n                      </div>\n                    </div>\n                  </div>\n                </motion.div>\n              ))}\n            </AnimatePresence>\n          </div>\n        </div>\n      </div>\n      <div className=\"mt-[16px] lg-desktop:mt-[24px]\">\n        <Swiper\n          slidesPerView={1}\n          effect=\"fade\"\n          fadeEffect={{ crossFade: true }}\n          modules={[Pagination, EffectFade]}\n          onSlideChange={swiper => {\n            const newIndex = swiper.realIndex\n            setIdx(newIndex)\n          }}\n          onSwiper={swiper => setSwiper(swiper)}\n        >\n          {items.map((it: TabItem, ind: number) => (\n            <SwiperSlide key={ind} style={{ transition: 'opacity 1s ease-in-out' }} className=\"rounded-[26px]\">\n              <div>\n                <Text\n                  as=\"p\"\n                  size={2}\n                  html={it.desc}\n                  className=\"text-center desktop:text-[20px] lg-desktop:text-[18px]\"\n                />\n              </div>\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n      <div className=\"mt-[24px] overflow-hidden rounded-[22px] laptop:mt-[32px] desktop:mt-[40px] lg-desktop:mt-[64px]\">\n        <video\n          className=\"mx-auto h-[360px] w-fit desktop:h-[448px] lg-desktop:h-[560px]\"\n          src={isMob ? mobvideo?.url : video?.url}\n          poster={poster?.url}\n          playsInline\n          autoPlay\n          muted\n          loop\n          ref={videoRef}\n        />\n      </div>\n    </section>\n  )\n})\n\nTabsWithMedia.displayName = 'TabsWithMedia'\n\nexport default withLayout(TabsWithMedia)\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport React, { useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { TabsWithMediaProps, TabItem, TimeIndex } from './types.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Pagination, EffectFade } from 'swiper/modules'\nimport type { Swiper as SwiperType } from 'swiper'\nimport { motion, AnimatePresence } from 'framer-motion'\nimport { useMediaQuery } from 'react-responsive'\n\nconst componentType = 'video'\nconst componentName = 'tabs_with_media'\n\n// \u9ED8\u8BA4\u65F6\u95F4\u70B9\u914D\u7F6E\nconst defaultTimeIdx: TimeIndex[] = [\n  { time: 2.4, point: 2.4, highlightIdx: 0 },\n  { time: 2.5, point: 4.9, highlightIdx: 1 },\n  { time: 2.5, point: 7.4, highlightIdx: 2 },\n  { time: 2.8, point: 10.2, highlightIdx: 3 },\n  { time: 2.6, point: 12.8, highlightIdx: 4 },\n  { time: 3.2, point: 16, highlightIdx: 5 },\n]\n\nconst TabsWithMedia = React.forwardRef<HTMLDivElement, TabsWithMediaProps>(({ data, className }, ref) => {\n  const { title, poster, video, mobvideo, items = [], timeIdx = defaultTimeIdx } = data\n\n  const [swiper, setSwiper] = useState<SwiperType | null>(null)\n  const tabRefs = useRef<(HTMLDivElement | null)[]>([])\n  const scrollContainerRef = useRef<HTMLDivElement>(null)\n  const videoRef = useRef<HTMLVideoElement>(null)\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  const scrollToTabCenter = (index: number) => {\n    const container = scrollContainerRef.current\n    const tab = tabRefs.current[index]\n\n    if (container && tab) {\n      const containerRect = container.getBoundingClientRect()\n      const tabRect = tab.getBoundingClientRect()\n      const offset = tabRect.left - containerRect.left\n      const scroll = offset - container.clientWidth / 2 + tab.clientWidth / 2\n\n      container.scrollTo({\n        left: container.scrollLeft + scroll,\n        behavior: 'smooth',\n      })\n    }\n  }\n\n  const isMob = useMediaQuery({ query: '(max-width: 768px)' })\n\n  const [list, listDouble, row, center, listLength] = useMemo(() => {\n    const row = 5\n    const center = 2\n    const listLength = items.length\n\n    const list =\n      items?.map((item: TabItem, index: number) => {\n        return {\n          ...item,\n          key: index,\n          index: index,\n        }\n      }) || []\n\n    return [list, list.concat(list), row, center, listLength]\n  }, [items, isMob])\n\n  const [idx, setIdx] = useState(center)\n\n  const [cureentList, setCureentList] = useState(listDouble.slice(0, row))\n\n  // \u70B9\u51FB tab \u8DF3\u8F6C\u5BF9\u5E94\u89C6\u9891\u4F4D\u7F6E\n  const handleNavClick = (key: number, index: number, isAuto?: boolean) => {\n    if (key === idx) return\n    if (index === center) return\n    if (index > center) {\n      const gap = index - center\n      const copy = [...cureentList]\n      copy.splice(0, gap)\n      const lastkey = (cureentList[cureentList.length - 1] as any)?.key + 1\n      const add = [...listDouble].splice(lastkey, gap)\n      copy.push(...add)\n      setCureentList([...copy])\n    }\n    if (index < center) {\n      const gap = center - index\n      const copy = [...cureentList]\n      copy.splice(-gap)\n      const firstkey = (cureentList[0] as any)?.key\n      const add = [...listDouble].splice(listLength + firstkey - gap, gap)\n      copy.unshift(...add)\n      setCureentList([...copy])\n    }\n\n    setIdx(key)\n    swiper?.slideTo(key)\n\n    if (!isAuto) {\n      let time = 0\n      timeIdx.forEach(item => {\n        if (item.highlightIdx < key) {\n          time += item.time\n        }\n      })\n      if (videoRef.current) {\n        videoRef.current.currentTime = time\n      }\n    }\n  }\n\n  // \u64AD\u653E\u65F6\u6839\u636E\u65F6\u95F4\u5207\u6362 Swiper + tab\n  useEffect(() => {\n    const video = videoRef.current\n    if (!video) return\n\n    const handleTimeUpdate = () => {\n      const currentTime = video.currentTime\n\n      // \u81EA\u52A8\u5207\u6362\u5185\u5BB9\n      for (let i = 0; i < timeIdx.length; i++) {\n        const prev = i === 0 ? 0 : timeIdx[i - 1].point\n        if (currentTime >= prev && currentTime < timeIdx[i].point) {\n          handleNavClick(timeIdx[i].highlightIdx, timeIdx[i].highlightIdx, true)\n          break\n        }\n      }\n\n      // \u4FEE\u590D\uFF1A\u64AD\u653E\u5230\u6700\u540E\u540E\u81EA\u52A8\u5F52\u96F6\u5E76\u91CD\u65B0\u64AD\u653E\n      if (currentTime >= timeIdx[timeIdx.length - 1].point) {\n        video.currentTime = 0\n        video.play()\n      }\n    }\n\n    video.addEventListener('timeupdate', handleTimeUpdate)\n    return () => {\n      video.removeEventListener('timeupdate', handleTimeUpdate)\n    }\n  }, [swiper, timeIdx])\n\n  return (\n    <section\n      ref={boxRef}\n      data-ui-component-id=\"TabsWithMedia\"\n      className={cn('flex flex-col overflow-hidden text-[#fff] sm:overflow-visible', className)}\n    >\n      <Heading as=\"h3\" size={4} html={title} className=\"text-center\" />\n      <div className=\" relative w-full overflow-x-auto scrollbar-hidden sm:overflow-visible\">\n        <div className={cn('mx-auto mt-[16px] w-full max-w-[824px] tablet:w-fit')}>\n          <div\n            className={cn('flex translate-x-0 items-center justify-center gap-[16px] transition-all md:gap-[8px]')}\n            ref={scrollContainerRef}\n          >\n            <AnimatePresence mode=\"popLayout\">\n              {cureentList?.map((item: any, index: number) => (\n                <motion.div\n                  {...({ layout: true } as any)}\n                  key={item?.key}\n                  ref={el => {\n                    tabRefs.current[item?.index] = el\n                  }}\n                  onClick={() => {\n                    handleNavClick(item?.key, index)\n                  }}\n                  className=\"min-w-[28px] flex-none cursor-pointer overflow-hidden sm:overflow-visible\"\n                  initial={{ opacity: 1 }}\n                  animate={{ opacity: 1 }}\n                  exit={{ opacity: 0 }}\n                  transition={{\n                    duration: 0.3,\n                    ease: 'easeOut',\n                  }}\n                >\n                  <div className=\"flex items-center justify-between\">\n                    <div\n                      className={cn('flex', {\n                        'flex items-center justify-center gap-[8px] rounded-[48px] bg-[#fff] p-2 md:gap-[4px] md:p-1':\n                          idx === item?.key,\n                      })}\n                    >\n                      <div\n                        className={cn(\n                          'flex h-[28] w-[28] items-center justify-center rounded-full md:flex-shrink-0 lg-desktop:h-[48px] lg-desktop:w-[48px]',\n                          {\n                            'h-[28px] w-[28px] bg-[#ccc] bg-opacity-50 lg-desktop:h-[48px] lg-desktop:w-[48px]':\n                              idx !== item?.index,\n                          }\n                        )}\n                        style={\n                          idx === item?.key\n                            ? {\n                                background: 'var(--1, linear-gradient(90deg, #3AD1FF 0%, #008CD6 100%))',\n                              }\n                            : undefined\n                        }\n                      >\n                        <Picture\n                          source={item?.icon?.url}\n                          alt={item?.icon?.alt}\n                          className=\"h-[22px] w-[22px] md:h-[14px] md:w-[14px]\"\n                        />\n                      </div>\n\n                      <div className=\"\">\n                        <Heading\n                          as=\"h4\"\n                          size={2}\n                          html={item?.tab}\n                          className={cn(\n                            'dynamic-width-heading line-clamp-1 h-0 w-0 overflow-hidden whitespace-nowrap text-nowrap text-[#000] opacity-0 transition-all duration-300 ease-linear xs:text-[16px] sm:text-[18px]',\n                            {\n                              'h-auto w-[calc-size(auto,size)] px-[6px] opacity-100': idx === item?.key,\n                            }\n                          )}\n                        />\n                      </div>\n                    </div>\n                  </div>\n                </motion.div>\n              ))}\n            </AnimatePresence>\n          </div>\n        </div>\n      </div>\n      <div className=\"mt-[16px] lg-desktop:mt-[24px]\">\n        <Swiper\n          slidesPerView={1}\n          effect=\"fade\"\n          fadeEffect={{ crossFade: true }}\n          modules={[Pagination, EffectFade]}\n          onSlideChange={swiper => {\n            const newIndex = swiper.realIndex\n            setIdx(newIndex)\n          }}\n          onSwiper={swiper => setSwiper(swiper)}\n        >\n          {items.map((it: TabItem, ind: number) => (\n            <SwiperSlide key={ind} style={{ transition: 'opacity 1s ease-in-out' }} className=\"rounded-[26px]\">\n              <div>\n                <Text\n                  as=\"p\"\n                  size={2}\n                  html={it.desc}\n                  className=\"text-center desktop:text-[20px] lg-desktop:text-[18px]\"\n                />\n              </div>\n            </SwiperSlide>\n          ))}\n        </Swiper>\n      </div>\n      <div className=\"mt-[24px] overflow-hidden rounded-[22px] laptop:mt-[32px] desktop:mt-[40px] lg-desktop:mt-[64px]\">\n        <video\n          className=\"mx-auto h-[360px] w-fit desktop:h-[448px] lg-desktop:h-[560px]\"\n          src={isMob ? mobvideo?.url : video?.url}\n          poster={poster?.url}\n          playsInline\n          autoPlay\n          muted\n          loop\n          ref={videoRef}\n        />\n      </div>\n    </section>\n  )\n})\n\nTabsWithMedia.displayName = 'TabsWithMedia'\n\nexport default withLayout(TabsWithMedia)\n"],
+  "mappings": "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",
   "names": ["TabsWithMedia_exports", "__export", "TabsWithMedia_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_Styles", "import_useExposure", "import_modules", "import_framer_motion", "import_react_responsive", "componentType", "componentName", "defaultTimeIdx", "TabsWithMedia", "React", "data", "className", "ref", "title", "poster", "video", "mobvideo", "items", "timeIdx", "swiper", "setSwiper", "tabRefs", "scrollContainerRef", "videoRef", "boxRef", "scrollToTabCenter", "index", "container", "tab", "containerRect", "scroll", "isMob", "list", "listDouble", "row", "center", "listLength", "item", "idx", "setIdx", "cureentList", "setCureentList", "handleNavClick", "key", "isAuto", "gap", "copy", "lastkey", "add", "firstkey", "time", "handleTimeUpdate", "currentTime", "i", "prev", "el", "newIndex", "it", "ind"]
 }

package/dist/cjs/biz-components/index.d.ts

@@ -34,6 +34,23 @@ export { default as CreativeModule } from './CreativeModule/index.js';
 export { default as GraphicOverlay } from './GraphicOverlay/index.js';
 export { default as Specs } from './Specs/index.js';
 export { default as TabGroup } from './TabsGroup/index.js';
+export { default as Listing } from './Listing/index.js';
+export { default as BizProductProvider } from './Listing/BizProductProvider.js';
+export { default as PurchaseBar } from './Listing/components/PurchaseBar/index.js';
+export { default as ProductActions } from './Listing/components/PurchaseBar/ProductActions/index.js';
+export { default as ProductCard } from './Listing/components/ProductCard/index.js';
+export { default as ProductBenefitsTabs } from './Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/index.js';
+export { default as ProductHighlight } from './Listing/components/ProductCard/ProductDetail/ProductHighlight/index.js';
+export { default as ProductFreeGift } from './Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js';
+export { default as ProductExchangePurchase } from './Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js';
+export { default as ProductOptions } from './Listing/components/ProductCard/ProductDetail/ProductOptions/index.js';
+export { default as ProductBundle } from './Listing/components/ProductCard/ProductDetail/ProductBundle/index.js';
+export { default as ProductGridBox } from './Listing/components/ProductCard/ProductGridBox.js';
+export { default as ProductGallery } from './Listing/components/ProductCard/ProductGallery/index.js';
+export { default as ProductDetail } from './Listing/components/ProductCard/ProductDetail/index.js';
+export { default as ProductSummary } from './Listing/components/ProductCard/ProductSummary/index.js';
+export { default as BenefitsTab } from './Listing/components/ProductCard/ProductDetail/BenefitsTab';
+export { default as PaidShipping } from './Listing/components/PaidShipping/index.js';
 export { default as ProductCompare } from './ProductCompare/index.js';
 export type { ProductCompareProps, ProductItemData } from './ProductCompare/index.js';
 export { default as Ksp } from './Ksp/index.js';

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

@@ -1,2 +1,2 @@
-"use strict";var X=Object.create;var i=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var ee=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var re=(a,r)=>{for(var t in r)i(a,t,{get:r[t],enumerable:!0})},f=(a,r,t,c)=>{if(r&&typeof r=="object"||typeof r=="function")for(let p of $(r))!ae.call(a,p)&&p!==t&&i(a,p,{get:()=>r[p],enumerable:!(c=Z(r,p))||c.enumerable});return a};var e=(a,r,t)=>(t=a!=null?X(ee(a)):{},f(r||!a||!a.__esModule?i(t,"default",{value:a,enumerable:!0}):t,a)),te=a=>f(i({},"__esModule",{value:!0}),a);var pe={};re(pe,{AccordionCards:()=>g.default,AiuiProvider:()=>A.default,BrandEquity:()=>u.default,Category:()=>h.default,CreativeModule:()=>D.default,Evaluate:()=>y.default,Faq:()=>F.default,FeatureCards:()=>N.default,FeatureShowcase:()=>J.default,FooterNavigation:()=>j.default,Graphic:()=>M.default,GraphicAttractionBlock:()=>B.default,GraphicOverlay:()=>E.default,HeaderNavigation:()=>G.default,HeroBanner:()=>P.default,IPC_SEARCH_PAGE:()=>s.IPC_SEARCH_PAGE,ImageTextFeature:()=>O.default,ImageWithText:()=>_.default,Ksp:()=>K.default,Marquee:()=>I.default,MarqueeImageContent:()=>o.MarqueeImageContent,MarqueeItem:()=>o.MarqueeItem,MarqueeReview:()=>b.default,MarqueeTextContent:()=>o.MarqueeTextContent,MediaPlayerBase:()=>C.default,MediaPlayerMulti:()=>T.default,MediaPlayerSticky:()=>S.default,MemberEquity:()=>l.default,MultiLayoutGraphicBlock:()=>v.default,PAYLOAD_COMPONENT_MAP:()=>oe,ProductCompare:()=>R.default,ProductHero:()=>Q.default,SearchPage:()=>k.default,SearchPageTabType:()=>s.SearchPageTabType,ShelfDisplay:()=>n.default,Slogan:()=>m.default,Spacer:()=>x.default,Specs:()=>L.default,SpecsComparison:()=>U.default,TabGroup:()=>H.default,TabWithImage:()=>z.default,Tabs:()=>W.default,TabsWithMedia:()=>Y.default,Title:()=>d.default,VideoFeature:()=>V.default,WhyChoose:()=>q.default,withLayout:()=>w.withLayout});module.exports=te(pe);var u=e(require("./BrandEquity/index.js")),l=e(require("./MemberEquity/index.js")),m=e(require("./Slogan/index.js")),d=e(require("./Title/index.js")),x=e(require("./Spacer/index.js")),n=e(require("./ShelfDisplay/index.js")),y=e(require("./Evaluate/index.js")),h=e(require("./Category/index.js")),P=e(require("./HeroBanner/index.js")),g=e(require("./AccordionCards/index.js")),M=e(require("./Graphic/index.js")),C=e(require("./MediaPlayerBase/index.js")),S=e(require("./MediaPlayerSticky/index.js")),T=e(require("./MediaPlayerMulti/index.js")),I=e(require("./Marquee/index.js")),b=e(require("./MarqueeReview/index.js")),q=e(require("./WhyChoose/index.js")),F=e(require("./Faq/index.js")),o=require("./Marquee/index.js"),v=e(require("./MultiLayoutGraphicBlock/index.js")),B=e(require("./GraphicAttractionBlock/index.js")),G=e(require("./HeaderNavigation/index.js")),j=e(require("./FooterNavigation/index.js")),k=e(require("./SearchPage/index.js")),s=require("./SearchPage/types.js"),w=require("../shared/Styles.js"),A=e(require("./AiuiProvider/index.js")),W=e(require("./Tabs/index.js")),D=e(require("./CreativeModule/index.js")),E=e(require("./GraphicOverlay/index.js")),L=e(require("./Specs/index.js")),H=e(require("./TabsGroup/index.js")),R=e(require("./ProductCompare/index.js")),K=e(require("./Ksp/index.js")),O=e(require("./ImageTextFeature/index.js")),N=e(require("./FeatureCards/index.js")),_=e(require("./ImageWithText/index.js")),V=e(require("./VideoFeature/index.js")),Y=e(require("./TabsWithMedia/index.js")),z=e(require("./TabWithImage/index.js")),J=e(require("./FeatureShowcase/index.js")),Q=e(require("./ProductHero/index.js")),U=e(require("./SpecsComparison/index.js"));const oe={"ipc-aplusdesc":"AplusDesc","ipc-banner":"Banner","ipc-brand-equity":"BrandEquity","ipc-category":"Category","ipc-collection-banner":"CollectionBanner","ipc-collection-shelves":"CollectionShelves","ipc-creativemodule":"CreativeModule","ipc-download":"DownLoad","ipc-evaluate":"Evaluate","ipc-faq":"Faq","ipc-features":"Features","ipc-footcharger":"FootCharger","ipc-ga-block":"GraphicAttractionBlock","ipc-giftbox":"GiftBox","ipc-graphic":"Graphic","ipc-graphicmore":"GraphicMore","ipc-graphicoverlay":"GraphicOverlay","ipc-marquee":"Marquee","ipc-mediaplayerbase":"MediaPlayerBase","ipc-mediaplayermulti":"MediaPlayerMulti","ipc-mediaplayersticky":"MediaPlayerSticky","ipc-member-equity":"MemberEquity","ipc-mlg-block":"MultiLayoutGraphicBlock","ipc-search-page-tabs":"SearchPageBlock","ipc-selectstore":"SelectStore","ipc-shelfdisplay":"ShelfDisplay","ipc-slogan":"Slogan","ipc-spacer":"Spacer","ipc-specs":"Specs","ipc-tabs":"Tabs","ipc-text-marquee":"TextMarquee","ipc-title":"Title","ipc-whychoose":"WhyChoose"};
+"use strict";var xe=Object.create;var i=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var he=Object.getOwnPropertyNames;var Pe=Object.getPrototypeOf,ye=Object.prototype.hasOwnProperty;var ge=(r,a)=>{for(var t in a)i(r,t,{get:a[t],enumerable:!0})},u=(r,a,t,f)=>{if(a&&typeof a=="object"||typeof a=="function")for(let p of he(a))!ye.call(r,p)&&p!==t&&i(r,p,{get:()=>a[p],enumerable:!(f=ne(a,p))||f.enumerable});return r};var e=(r,a,t)=>(t=r!=null?xe(Pe(r)):{},u(a||!r||!r.__esModule?i(t,"default",{value:r,enumerable:!0}):t,r)),Me=r=>u(i({},"__esModule",{value:!0}),r);var Ce={};ge(Ce,{AccordionCards:()=>g.default,AiuiProvider:()=>A.default,BenefitsTab:()=>re.default,BizProductProvider:()=>R.default,BrandEquity:()=>d.default,Category:()=>P.default,CreativeModule:()=>D.default,Evaluate:()=>h.default,Faq:()=>q.default,FeatureCards:()=>ie.default,FeatureShowcase:()=>ce.default,FooterNavigation:()=>j.default,Graphic:()=>M.default,GraphicAttractionBlock:()=>v.default,GraphicOverlay:()=>E.default,HeaderNavigation:()=>G.default,HeroBanner:()=>y.default,IPC_SEARCH_PAGE:()=>s.IPC_SEARCH_PAGE,ImageTextFeature:()=>pe.default,ImageWithText:()=>se.default,Ksp:()=>oe.default,Listing:()=>O.default,Marquee:()=>b.default,MarqueeImageContent:()=>o.MarqueeImageContent,MarqueeItem:()=>o.MarqueeItem,MarqueeReview:()=>I.default,MarqueeTextContent:()=>o.MarqueeTextContent,MediaPlayerBase:()=>S.default,MediaPlayerMulti:()=>T.default,MediaPlayerSticky:()=>C.default,MemberEquity:()=>c.default,MultiLayoutGraphicBlock:()=>F.default,PAYLOAD_COMPONENT_MAP:()=>Se,PaidShipping:()=>ae.default,ProductActions:()=>N.default,ProductBenefitsTabs:()=>V.default,ProductBundle:()=>U.default,ProductCard:()=>_.default,ProductCompare:()=>te.default,ProductDetail:()=>$.default,ProductExchangePurchase:()=>J.default,ProductFreeGift:()=>Y.default,ProductGallery:()=>Z.default,ProductGridBox:()=>X.default,ProductHero:()=>le.default,ProductHighlight:()=>z.default,ProductOptions:()=>Q.default,ProductSummary:()=>ee.default,PurchaseBar:()=>K.default,SearchPage:()=>k.default,SearchPageTabType:()=>s.SearchPageTabType,ShelfDisplay:()=>n.default,Slogan:()=>l.default,Spacer:()=>x.default,Specs:()=>L.default,SpecsComparison:()=>me.default,TabGroup:()=>H.default,TabWithImage:()=>de.default,Tabs:()=>W.default,TabsWithMedia:()=>ue.default,Title:()=>m.default,VideoFeature:()=>fe.default,WhyChoose:()=>B.default,withLayout:()=>w.withLayout});module.exports=Me(Ce);var d=e(require("./BrandEquity/index.js")),c=e(require("./MemberEquity/index.js")),l=e(require("./Slogan/index.js")),m=e(require("./Title/index.js")),x=e(require("./Spacer/index.js")),n=e(require("./ShelfDisplay/index.js")),h=e(require("./Evaluate/index.js")),P=e(require("./Category/index.js")),y=e(require("./HeroBanner/index.js")),g=e(require("./AccordionCards/index.js")),M=e(require("./Graphic/index.js")),S=e(require("./MediaPlayerBase/index.js")),C=e(require("./MediaPlayerSticky/index.js")),T=e(require("./MediaPlayerMulti/index.js")),b=e(require("./Marquee/index.js")),I=e(require("./MarqueeReview/index.js")),B=e(require("./WhyChoose/index.js")),q=e(require("./Faq/index.js")),o=require("./Marquee/index.js"),F=e(require("./MultiLayoutGraphicBlock/index.js")),v=e(require("./GraphicAttractionBlock/index.js")),G=e(require("./HeaderNavigation/index.js")),j=e(require("./FooterNavigation/index.js")),k=e(require("./SearchPage/index.js")),s=require("./SearchPage/types.js"),w=require("../shared/Styles.js"),A=e(require("./AiuiProvider/index.js")),W=e(require("./Tabs/index.js")),D=e(require("./CreativeModule/index.js")),E=e(require("./GraphicOverlay/index.js")),L=e(require("./Specs/index.js")),H=e(require("./TabsGroup/index.js")),O=e(require("./Listing/index.js")),R=e(require("./Listing/BizProductProvider.js")),K=e(require("./Listing/components/PurchaseBar/index.js")),N=e(require("./Listing/components/PurchaseBar/ProductActions/index.js")),_=e(require("./Listing/components/ProductCard/index.js")),V=e(require("./Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/index.js")),z=e(require("./Listing/components/ProductCard/ProductDetail/ProductHighlight/index.js")),Y=e(require("./Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js")),J=e(require("./Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js")),Q=e(require("./Listing/components/ProductCard/ProductDetail/ProductOptions/index.js")),U=e(require("./Listing/components/ProductCard/ProductDetail/ProductBundle/index.js")),X=e(require("./Listing/components/ProductCard/ProductGridBox.js")),Z=e(require("./Listing/components/ProductCard/ProductGallery/index.js")),$=e(require("./Listing/components/ProductCard/ProductDetail/index.js")),ee=e(require("./Listing/components/ProductCard/ProductSummary/index.js")),re=e(require("./Listing/components/ProductCard/ProductDetail/BenefitsTab")),ae=e(require("./Listing/components/PaidShipping/index.js")),te=e(require("./ProductCompare/index.js")),oe=e(require("./Ksp/index.js")),pe=e(require("./ImageTextFeature/index.js")),ie=e(require("./FeatureCards/index.js")),se=e(require("./ImageWithText/index.js")),fe=e(require("./VideoFeature/index.js")),ue=e(require("./TabsWithMedia/index.js")),de=e(require("./TabWithImage/index.js")),ce=e(require("./FeatureShowcase/index.js")),le=e(require("./ProductHero/index.js")),me=e(require("./SpecsComparison/index.js"));const Se={"ipc-aplusdesc":"AplusDesc","ipc-banner":"Banner","ipc-brand-equity":"BrandEquity","ipc-category":"Category","ipc-collection-banner":"CollectionBanner","ipc-collection-shelves":"CollectionShelves","ipc-creativemodule":"CreativeModule","ipc-download":"DownLoad","ipc-evaluate":"Evaluate","ipc-faq":"Faq","ipc-features":"Features","ipc-footcharger":"FootCharger","ipc-ga-block":"GraphicAttractionBlock","ipc-giftbox":"GiftBox","ipc-graphic":"Graphic","ipc-graphicmore":"GraphicMore","ipc-graphicoverlay":"GraphicOverlay","ipc-marquee":"Marquee","ipc-mediaplayerbase":"MediaPlayerBase","ipc-mediaplayermulti":"MediaPlayerMulti","ipc-mediaplayersticky":"MediaPlayerSticky","ipc-member-equity":"MemberEquity","ipc-mlg-block":"MultiLayoutGraphicBlock","ipc-search-page-tabs":"SearchPageBlock","ipc-selectstore":"SelectStore","ipc-shelfdisplay":"ShelfDisplay","ipc-slogan":"Slogan","ipc-spacer":"Spacer","ipc-specs":"Specs","ipc-tabs":"Tabs","ipc-text-marquee":"TextMarquee","ipc-title":"Title","ipc-whychoose":"WhyChoose"};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/biz-components/index.ts"],
-  "sourcesContent": ["export { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as Spacer } from './Spacer/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport { default as MarqueeReview } from './MarqueeReview/index.js'\nexport type { MarqueeReviewProps, MarqueeReviewData, ReviewItem } from './MarqueeReview/index.js'\nexport { default as WhyChoose } from './WhyChoose/index.js'\nexport { default as Faq } from './Faq/index.js'\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee/index.js'\nexport { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js'\nexport type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js'\nexport { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js'\nexport type { GraphicAttractionBlockProps } from './GraphicAttractionBlock/index.js'\nexport { default as HeaderNavigation } from './HeaderNavigation/index.js'\nexport { default as FooterNavigation } from './FooterNavigation/index.js'\nexport { default as SearchPage } from './SearchPage/index.js'\nexport type { SearchPageProps } from './SearchPage/types.js'\nexport { IPC_SEARCH_PAGE, SearchPageTabType } from './SearchPage/types.js'\n\nexport { withLayout } from '../shared/Styles.js'\nexport { default as AiuiProvider } from './AiuiProvider/index.js'\nexport { default as Tabs } from './Tabs/index.js'\nexport { default as CreativeModule } from './CreativeModule/index.js'\nexport { default as GraphicOverlay } from './GraphicOverlay/index.js'\nexport { default as Specs } from './Specs/index.js'\nexport { default as TabGroup } from './TabsGroup/index.js'\nexport { default as ProductCompare } from './ProductCompare/index.js'\nexport type { ProductCompareProps, ProductItemData } from './ProductCompare/index.js'\nexport { default as Ksp } from './Ksp/index.js'\nexport type { KspProps, KspData, KspCardItem } from './Ksp/index.js'\nexport { default as ImageTextFeature } from './ImageTextFeature/index.js'\nexport type { ImageTextFeatureProps, ImageTextFeatureItem } from './ImageTextFeature/index.js'\nexport { default as FeatureCards } from './FeatureCards/index.js'\nexport type { FeatureCardsProps, FeatureCardItem } from './FeatureCards/index.js'\nexport { default as ImageWithText } from './ImageWithText/index.js'\nexport type { ImageWithTextProps } from './ImageWithText/index.js'\nexport { default as VideoFeature } from './VideoFeature/index.js'\nexport type { VideoFeatureProps } from './VideoFeature/index.js'\nexport { default as TabsWithMedia } from './TabsWithMedia/index.js'\nexport type { TabsWithMediaProps, TabItem, TimeIndex } from './TabsWithMedia/index.js'\nexport { default as TabWithImage } from './TabWithImage/index.js'\nexport type { TabWithImageProps, TabWithImageDataItem } from './TabWithImage/index.js'\nexport { default as FeatureShowcase } from './FeatureShowcase/index.js'\nexport type { FeatureShowcaseProps, FeatureShowcaseItem } from './FeatureShowcase/index.js'\nexport { default as ProductHero } from './ProductHero/index.js'\nexport type { ProductHeroProps } from './ProductHero/index.js'\nexport { default as SpecsComparison } from './SpecsComparison/index.js'\nexport type {\n  SpecsComparisonProps,\n  SpecsComparisonMenuItem,\n  SpecsComparisonLeftMenuItem,\n} from './SpecsComparison/index.js'\n\nexport const PAYLOAD_COMPONENT_MAP = {\n  'ipc-aplusdesc': 'AplusDesc',\n  'ipc-banner': 'Banner',\n  'ipc-brand-equity': 'BrandEquity',\n  'ipc-category': 'Category',\n  'ipc-collection-banner': 'CollectionBanner',\n  'ipc-collection-shelves': 'CollectionShelves',\n  'ipc-creativemodule': 'CreativeModule',\n  'ipc-download': 'DownLoad',\n  'ipc-evaluate': 'Evaluate',\n  'ipc-faq': 'Faq',\n  'ipc-features': 'Features',\n  'ipc-footcharger': 'FootCharger',\n  'ipc-ga-block': 'GraphicAttractionBlock',\n  'ipc-giftbox': 'GiftBox',\n  'ipc-graphic': 'Graphic',\n  'ipc-graphicmore': 'GraphicMore',\n  'ipc-graphicoverlay': 'GraphicOverlay',\n  'ipc-marquee': 'Marquee',\n  'ipc-mediaplayerbase': 'MediaPlayerBase',\n  'ipc-mediaplayermulti': 'MediaPlayerMulti',\n  'ipc-mediaplayersticky': 'MediaPlayerSticky',\n  'ipc-member-equity': 'MemberEquity',\n  'ipc-mlg-block': 'MultiLayoutGraphicBlock',\n  'ipc-search-page-tabs': 'SearchPageBlock',\n  'ipc-selectstore': 'SelectStore',\n  'ipc-shelfdisplay': 'ShelfDisplay',\n  'ipc-slogan': 'Slogan',\n  'ipc-spacer': 'Spacer',\n  'ipc-specs': 'Specs',\n  'ipc-tabs': 'Tabs',\n  'ipc-text-marquee': 'TextMarquee',\n  'ipc-title': 'Title',\n  'ipc-whychoose': 'WhyChoose',\n}\n"],
-  "mappings": "gkBAAA,IAAAA,GAAA,GAAAC,GAAAD,GAAA,62BAAAE,GAAA,scAAAC,GAAAH,IAAA,IAAAI,EAAuC,qCACvCC,EAAwC,sCACxCC,EAAkC,gCAClCC,EAAiC,+BACjCC,EAAkC,gCAClCC,EAAwC,sCACxCC,EAAoC,kCACpCC,EAAoC,kCACpCC,EAAsC,oCACtCC,EAA0C,wCAC1CC,EAAmC,iCACnCC,EAA2C,yCAC3CC,EAA6C,2CAC7CC,EAA4C,0CAC5CC,EAAmC,iCACnCC,EAAyC,uCAEzCC,EAAqC,mCACrCC,EAA+B,6BAC/BH,EAAqE,8BACrEI,EAAmD,iDAEnDC,EAAkD,gDAElDC,EAA4C,0CAC5CC,EAA4C,0CAC5CC,EAAsC,oCAEtCC,EAAmD,iCAEnDC,EAA2B,+BAC3BC,EAAwC,sCACxCC,EAAgC,8BAChCC,EAA0C,wCAC1CC,EAA0C,wCAC1CC,EAAiC,+BACjCC,EAAoC,mCACpCC,EAA0C,wCAE1CC,EAA+B,6BAE/BC,EAA4C,0CAE5CC,EAAwC,sCAExCC,EAAyC,uCAEzCC,EAAwC,sCAExCC,EAAyC,uCAEzCC,EAAwC,sCAExCC,EAA2C,yCAE3CC,EAAuC,qCAEvCC,EAA2C,yCAOpC,MAAM3C,GAAwB,CACnC,gBAAiB,YACjB,aAAc,SACd,mBAAoB,cACpB,eAAgB,WAChB,wBAAyB,mBACzB,yBAA0B,oBAC1B,qBAAsB,iBACtB,eAAgB,WAChB,eAAgB,WAChB,UAAW,MACX,eAAgB,WAChB,kBAAmB,cACnB,eAAgB,yBAChB,cAAe,UACf,cAAe,UACf,kBAAmB,cACnB,qBAAsB,iBACtB,cAAe,UACf,sBAAuB,kBACvB,uBAAwB,mBACxB,wBAAyB,oBACzB,oBAAqB,eACrB,gBAAiB,0BACjB,uBAAwB,kBACxB,kBAAmB,cACnB,mBAAoB,eACpB,aAAc,SACd,aAAc,SACd,YAAa,QACb,WAAY,OACZ,mBAAoB,cACpB,YAAa,QACb,gBAAiB,WACnB",
-  "names": ["biz_components_exports", "__export", "PAYLOAD_COMPONENT_MAP", "__toCommonJS", "import_BrandEquity", "import_MemberEquity", "import_Slogan", "import_Title", "import_Spacer", "import_ShelfDisplay", "import_Evaluate", "import_Category", "import_HeroBanner", "import_AccordionCards", "import_Graphic", "import_MediaPlayerBase", "import_MediaPlayerSticky", "import_MediaPlayerMulti", "import_Marquee", "import_MarqueeReview", "import_WhyChoose", "import_Faq", "import_MultiLayoutGraphicBlock", "import_GraphicAttractionBlock", "import_HeaderNavigation", "import_FooterNavigation", "import_SearchPage", "import_types", "import_Styles", "import_AiuiProvider", "import_Tabs", "import_CreativeModule", "import_GraphicOverlay", "import_Specs", "import_TabsGroup", "import_ProductCompare", "import_Ksp", "import_ImageTextFeature", "import_FeatureCards", "import_ImageWithText", "import_VideoFeature", "import_TabsWithMedia", "import_TabWithImage", "import_FeatureShowcase", "import_ProductHero", "import_SpecsComparison"]
+  "sourcesContent": ["export { default as BrandEquity } from './BrandEquity/index.js'\nexport { default as MemberEquity } from './MemberEquity/index.js'\nexport { default as Slogan } from './Slogan/index.js'\nexport { default as Title } from './Title/index.js'\nexport { default as Spacer } from './Spacer/index.js'\nexport { default as ShelfDisplay } from './ShelfDisplay/index.js'\nexport { default as Evaluate } from './Evaluate/index.js'\nexport { default as Category } from './Category/index.js'\nexport { default as HeroBanner } from './HeroBanner/index.js'\nexport { default as AccordionCards } from './AccordionCards/index.js'\nexport { default as Graphic } from './Graphic/index.js'\nexport { default as MediaPlayerBase } from './MediaPlayerBase/index.js'\nexport { default as MediaPlayerSticky } from './MediaPlayerSticky/index.js'\nexport { default as MediaPlayerMulti } from './MediaPlayerMulti/index.js'\nexport { default as Marquee } from './Marquee/index.js'\nexport { default as MarqueeReview } from './MarqueeReview/index.js'\nexport type { MarqueeReviewProps, MarqueeReviewData, ReviewItem } from './MarqueeReview/index.js'\nexport { default as WhyChoose } from './WhyChoose/index.js'\nexport { default as Faq } from './Faq/index.js'\nexport { MarqueeItem, MarqueeImageContent, MarqueeTextContent } from './Marquee/index.js'\nexport { default as MultiLayoutGraphicBlock } from './MultiLayoutGraphicBlock/index.js'\nexport type { MultiLayoutGraphicBlockProps } from './MultiLayoutGraphicBlock/index.js'\nexport { default as GraphicAttractionBlock } from './GraphicAttractionBlock/index.js'\nexport type { GraphicAttractionBlockProps } from './GraphicAttractionBlock/index.js'\nexport { default as HeaderNavigation } from './HeaderNavigation/index.js'\nexport { default as FooterNavigation } from './FooterNavigation/index.js'\nexport { default as SearchPage } from './SearchPage/index.js'\nexport type { SearchPageProps } from './SearchPage/types.js'\nexport { IPC_SEARCH_PAGE, SearchPageTabType } from './SearchPage/types.js'\n\nexport { withLayout } from '../shared/Styles.js'\nexport { default as AiuiProvider } from './AiuiProvider/index.js'\nexport { default as Tabs } from './Tabs/index.js'\nexport { default as CreativeModule } from './CreativeModule/index.js'\nexport { default as GraphicOverlay } from './GraphicOverlay/index.js'\nexport { default as Specs } from './Specs/index.js'\nexport { default as TabGroup } from './TabsGroup/index.js'\nexport { default as Listing } from './Listing/index.js'\nexport { default as BizProductProvider } from './Listing/BizProductProvider.js'\nexport { default as PurchaseBar } from './Listing/components/PurchaseBar/index.js'\nexport { default as ProductActions } from './Listing/components/PurchaseBar/ProductActions/index.js'\nexport { default as ProductCard } from './Listing/components/ProductCard/index.js'\nexport { default as ProductBenefitsTabs } from './Listing/components/ProductCard/ProductDetail/ProductBenefitsTabs/index.js'\nexport { default as ProductHighlight } from './Listing/components/ProductCard/ProductDetail/ProductHighlight/index.js'\nexport { default as ProductFreeGift } from './Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js'\nexport { default as ProductExchangePurchase } from './Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.js'\nexport { default as ProductOptions } from './Listing/components/ProductCard/ProductDetail/ProductOptions/index.js'\nexport { default as ProductBundle } from './Listing/components/ProductCard/ProductDetail/ProductBundle/index.js'\nexport { default as ProductGridBox } from './Listing/components/ProductCard/ProductGridBox.js'\nexport { default as ProductGallery } from './Listing/components/ProductCard/ProductGallery/index.js'\nexport { default as ProductDetail } from './Listing/components/ProductCard/ProductDetail/index.js'\nexport { default as ProductSummary } from './Listing/components/ProductCard/ProductSummary/index.js'\nexport { default as BenefitsTab } from './Listing/components/ProductCard/ProductDetail/BenefitsTab'\nexport { default as PaidShipping } from './Listing/components/PaidShipping/index.js'\nexport { default as ProductCompare } from './ProductCompare/index.js'\nexport type { ProductCompareProps, ProductItemData } from './ProductCompare/index.js'\nexport { default as Ksp } from './Ksp/index.js'\nexport type { KspProps, KspData, KspCardItem } from './Ksp/index.js'\nexport { default as ImageTextFeature } from './ImageTextFeature/index.js'\nexport type { ImageTextFeatureProps, ImageTextFeatureItem } from './ImageTextFeature/index.js'\nexport { default as FeatureCards } from './FeatureCards/index.js'\nexport type { FeatureCardsProps, FeatureCardItem } from './FeatureCards/index.js'\nexport { default as ImageWithText } from './ImageWithText/index.js'\nexport type { ImageWithTextProps } from './ImageWithText/index.js'\nexport { default as VideoFeature } from './VideoFeature/index.js'\nexport type { VideoFeatureProps } from './VideoFeature/index.js'\nexport { default as TabsWithMedia } from './TabsWithMedia/index.js'\nexport type { TabsWithMediaProps, TabItem, TimeIndex } from './TabsWithMedia/index.js'\nexport { default as TabWithImage } from './TabWithImage/index.js'\nexport type { TabWithImageProps, TabWithImageDataItem } from './TabWithImage/index.js'\nexport { default as FeatureShowcase } from './FeatureShowcase/index.js'\nexport type { FeatureShowcaseProps, FeatureShowcaseItem } from './FeatureShowcase/index.js'\nexport { default as ProductHero } from './ProductHero/index.js'\nexport type { ProductHeroProps } from './ProductHero/index.js'\nexport { default as SpecsComparison } from './SpecsComparison/index.js'\nexport type {\n  SpecsComparisonProps,\n  SpecsComparisonMenuItem,\n  SpecsComparisonLeftMenuItem,\n} from './SpecsComparison/index.js'\n\nexport const PAYLOAD_COMPONENT_MAP = {\n  'ipc-aplusdesc': 'AplusDesc',\n  'ipc-banner': 'Banner',\n  'ipc-brand-equity': 'BrandEquity',\n  'ipc-category': 'Category',\n  'ipc-collection-banner': 'CollectionBanner',\n  'ipc-collection-shelves': 'CollectionShelves',\n  'ipc-creativemodule': 'CreativeModule',\n  'ipc-download': 'DownLoad',\n  'ipc-evaluate': 'Evaluate',\n  'ipc-faq': 'Faq',\n  'ipc-features': 'Features',\n  'ipc-footcharger': 'FootCharger',\n  'ipc-ga-block': 'GraphicAttractionBlock',\n  'ipc-giftbox': 'GiftBox',\n  'ipc-graphic': 'Graphic',\n  'ipc-graphicmore': 'GraphicMore',\n  'ipc-graphicoverlay': 'GraphicOverlay',\n  'ipc-marquee': 'Marquee',\n  'ipc-mediaplayerbase': 'MediaPlayerBase',\n  'ipc-mediaplayermulti': 'MediaPlayerMulti',\n  'ipc-mediaplayersticky': 'MediaPlayerSticky',\n  'ipc-member-equity': 'MemberEquity',\n  'ipc-mlg-block': 'MultiLayoutGraphicBlock',\n  'ipc-search-page-tabs': 'SearchPageBlock',\n  'ipc-selectstore': 'SelectStore',\n  'ipc-shelfdisplay': 'ShelfDisplay',\n  'ipc-slogan': 'Slogan',\n  'ipc-spacer': 'Spacer',\n  'ipc-specs': 'Specs',\n  'ipc-tabs': 'Tabs',\n  'ipc-text-marquee': 'TextMarquee',\n  'ipc-title': 'Title',\n  'ipc-whychoose': 'WhyChoose',\n}\n"],
+  "mappings": "skBAAA,IAAAA,GAAA,GAAAC,GAAAD,GAAA,o8BAAAE,GAAA,22BAAAC,GAAAH,IAAA,IAAAI,EAAuC,qCACvCC,EAAwC,sCACxCC,EAAkC,gCAClCC,EAAiC,+BACjCC,EAAkC,gCAClCC,EAAwC,sCACxCC,EAAoC,kCACpCC,EAAoC,kCACpCC,EAAsC,oCACtCC,EAA0C,wCAC1CC,EAAmC,iCACnCC,EAA2C,yCAC3CC,EAA6C,2CAC7CC,EAA4C,0CAC5CC,EAAmC,iCACnCC,EAAyC,uCAEzCC,EAAqC,mCACrCC,EAA+B,6BAC/BH,EAAqE,8BACrEI,EAAmD,iDAEnDC,EAAkD,gDAElDC,EAA4C,0CAC5CC,EAA4C,0CAC5CC,EAAsC,oCAEtCC,EAAmD,iCAEnDC,EAA2B,+BAC3BC,EAAwC,sCACxCC,EAAgC,8BAChCC,EAA0C,wCAC1CC,EAA0C,wCAC1CC,EAAiC,+BACjCC,EAAoC,mCACpCC,EAAmC,iCACnCC,EAA8C,8CAC9CC,EAAuC,wDACvCC,EAA0C,uEAC1CC,EAAuC,wDACvCC,EAA+C,0FAC/CC,EAA4C,uFAC5CC,EAA2C,sFAC3CC,EAAmD,8FACnDC,EAA0C,qFAC1CC,EAAyC,oFACzCC,EAA0C,iEAC1CC,EAA0C,uEAC1CC,EAAyC,sEACzCC,GAA0C,uEAC1CC,GAAuC,yEACvCC,GAAwC,yDACxCC,GAA0C,wCAE1CC,GAA+B,6BAE/BC,GAA4C,0CAE5CC,GAAwC,sCAExCC,GAAyC,uCAEzCC,GAAwC,sCAExCC,GAAyC,uCAEzCC,GAAwC,sCAExCC,GAA2C,yCAE3CC,GAAuC,qCAEvCC,GAA2C,yCAOpC,MAAM5D,GAAwB,CACnC,gBAAiB,YACjB,aAAc,SACd,mBAAoB,cACpB,eAAgB,WAChB,wBAAyB,mBACzB,yBAA0B,oBAC1B,qBAAsB,iBACtB,eAAgB,WAChB,eAAgB,WAChB,UAAW,MACX,eAAgB,WAChB,kBAAmB,cACnB,eAAgB,yBAChB,cAAe,UACf,cAAe,UACf,kBAAmB,cACnB,qBAAsB,iBACtB,cAAe,UACf,sBAAuB,kBACvB,uBAAwB,mBACxB,wBAAyB,oBACzB,oBAAqB,eACrB,gBAAiB,0BACjB,uBAAwB,kBACxB,kBAAmB,cACnB,mBAAoB,eACpB,aAAc,SACd,aAAc,SACd,YAAa,QACb,WAAY,OACZ,mBAAoB,cACpB,YAAa,QACb,gBAAiB,WACnB",
+  "names": ["biz_components_exports", "__export", "PAYLOAD_COMPONENT_MAP", "__toCommonJS", "import_BrandEquity", "import_MemberEquity", "import_Slogan", "import_Title", "import_Spacer", "import_ShelfDisplay", "import_Evaluate", "import_Category", "import_HeroBanner", "import_AccordionCards", "import_Graphic", "import_MediaPlayerBase", "import_MediaPlayerSticky", "import_MediaPlayerMulti", "import_Marquee", "import_MarqueeReview", "import_WhyChoose", "import_Faq", "import_MultiLayoutGraphicBlock", "import_GraphicAttractionBlock", "import_HeaderNavigation", "import_FooterNavigation", "import_SearchPage", "import_types", "import_Styles", "import_AiuiProvider", "import_Tabs", "import_CreativeModule", "import_GraphicOverlay", "import_Specs", "import_TabsGroup", "import_Listing", "import_BizProductProvider", "import_PurchaseBar", "import_ProductActions", "import_ProductCard", "import_ProductBenefitsTabs", "import_ProductHighlight", "import_ProductFreeGift", "import_ProductExchangePurchase", "import_ProductOptions", "import_ProductBundle", "import_ProductGridBox", "import_ProductGallery", "import_ProductDetail", "import_ProductSummary", "import_BenefitsTab", "import_PaidShipping", "import_ProductCompare", "import_Ksp", "import_ImageTextFeature", "import_FeatureCards", "import_ImageWithText", "import_VideoFeature", "import_TabsWithMedia", "import_TabWithImage", "import_FeatureShowcase", "import_ProductHero", "import_SpecsComparison"]
 }

package/dist/cjs/components/checkbox.d.ts

@@ -5,6 +5,7 @@ declare const checkboxVariants: (props?: ({
     size?: "base" | "lg" | "sm" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, VariantProps<typeof checkboxVariants> {
+    iconClassName?: string;
 }
 declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
 export default Checkbox;

package/dist/cjs/components/checkbox.js

@@ -1,2 +1,2 @@
-"use strict";"use client";var l=Object.create;var s=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var y=(e,o)=>{for(var i in o)s(e,i,{get:o[i],enumerable:!0})},n=(e,o,i,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of h(o))!u.call(e,r)&&r!==i&&s(e,r,{get:()=>o[r],enumerable:!(t=x(o,r))||t.enumerable});return e};var b=(e,o,i)=>(i=e!=null?l(k(e)):{},n(o||!e||!e.__esModule?s(i,"default",{value:e,enumerable:!0}):i,e)),C=e=>n(s({},"__esModule",{value:!0}),e);var R={};y(R,{default:()=>g});module.exports=C(R);var a=require("react/jsx-runtime"),v=b(require("react")),f=b(require("@radix-ui/react-checkbox")),d=require("@radix-ui/react-icons"),c=require("../helpers/index.js"),m=require("class-variance-authority");const P=(0,m.cva)("border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground disabled:bg-btn-primary-disabled peer shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",{variants:{size:{sm:"size-[14px]",base:"size-4",lg:"size-5"}},defaultVariants:{size:"base"}}),p=v.forwardRef(({className:e,size:o,...i},t)=>(0,a.jsx)(f.Root,{ref:t,className:(0,c.cn)(P({size:o}),e),...i,children:(0,a.jsx)(f.Indicator,{className:(0,c.cn)("flex size-full items-center justify-center text-current"),children:(0,a.jsx)(d.CheckIcon,{})})}));p.displayName="Checkbox";var g=p;
+"use strict";"use client";var b=Object.create;var a=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var k=(e,o)=>{for(var t in o)a(e,t,{get:o[t],enumerable:!0})},n=(e,o,t,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of h(o))!g.call(e,i)&&i!==t&&a(e,i,{get:()=>o[i],enumerable:!(s=m(o,i))||s.enumerable});return e};var l=(e,o,t)=>(t=e!=null?b(x(e)):{},n(o||!e||!e.__esModule?a(t,"default",{value:e,enumerable:!0}):t,e)),u=e=>n(a({},"__esModule",{value:!0}),e);var R={};k(R,{default:()=>P});module.exports=u(R);var r=require("react/jsx-runtime"),v=l(require("react")),d=l(require("@radix-ui/react-checkbox")),c=require("../helpers/index.js"),p=require("class-variance-authority");const C=e=>(0,r.jsx)("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:(0,r.jsx)("path",{d:"M7.5 15.8333L1.66667 10L3.75 7.91667L7.5 11.6667L16.25 3L18.3333 5.08333L7.5 15.8333Z",fill:"currentColor"})}),y=(0,p.cva)("border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground disabled:bg-btn-primary-disabled peer shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",{variants:{size:{sm:"size-[14px]",base:"size-4",lg:"size-5"}},defaultVariants:{size:"base"}}),f=v.forwardRef(({className:e,size:o,iconClassName:t,...s},i)=>(0,r.jsx)(d.Root,{ref:i,className:(0,c.cn)(y({size:o}),e),...s,children:(0,r.jsx)(d.Indicator,{className:(0,c.cn)("flex size-full items-center justify-center text-current"),children:(0,r.jsx)(C,{width:16,height:12,className:t})})}));f.displayName="Checkbox";var P=f;
 //# sourceMappingURL=checkbox.js.map

package/dist/cjs/components/checkbox.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/checkbox.tsx"],
-  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\nimport { CheckIcon } from '@radix-ui/react-icons'\n\nimport { cn } from '../helpers/index.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nconst checkboxVariants = cva(\n  'border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground disabled:bg-btn-primary-disabled peer shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',\n  {\n    variants: {\n      size: {\n        sm: 'size-[14px]',\n        base: 'size-4',\n        lg: 'size-5',\n      },\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\ninterface CheckboxProps\n  extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n    VariantProps<typeof checkboxVariants> {}\n\nconst Checkbox = React.forwardRef<React.ElementRef<typeof CheckboxPrimitive.Root>, CheckboxProps>(\n  ({ className, size, ...props }, ref) => (\n    <CheckboxPrimitive.Root ref={ref} className={cn(checkboxVariants({ size }), className)} {...props}>\n      <CheckboxPrimitive.Indicator className={cn('flex size-full items-center justify-center text-current')}>\n        <CheckIcon />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  )\n)\nCheckbox.displayName = 'Checkbox'\n\nexport default Checkbox\nexport type { CheckboxProps }\n"],
-  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAiCQ,IAAAI,EAAA,6BA/BRC,EAAuB,oBACvBC,EAAmC,uCACnCC,EAA0B,iCAE1BC,EAAmB,+BACnBC,EAAuC,oCAEvC,MAAMC,KAAmB,OACvB,0UACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,KAAM,SACN,GAAI,QACN,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAMMC,EAAWN,EAAM,WACrB,CAAC,CAAE,UAAAO,EAAW,KAAAC,EAAM,GAAGC,CAAM,EAAGC,OAC9B,OAACT,EAAkB,KAAlB,CAAuB,IAAKS,EAAK,aAAW,MAAGL,EAAiB,CAAE,KAAAG,CAAK,CAAC,EAAGD,CAAS,EAAI,GAAGE,EAC1F,mBAACR,EAAkB,UAAlB,CAA4B,aAAW,MAAG,yDAAyD,EAClG,mBAAC,cAAU,EACb,EACF,CAEJ,EACAK,EAAS,YAAc,WAEvB,IAAOT,EAAQS",
-  "names": ["checkbox_exports", "__export", "checkbox_default", "__toCommonJS", "import_jsx_runtime", "React", "CheckboxPrimitive", "import_react_icons", "import_helpers", "import_class_variance_authority", "checkboxVariants", "Checkbox", "className", "size", "props", "ref"]
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\n// import { CheckIcon } from '@radix-ui/react-icons'\n\nimport { cn } from '../helpers/index.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\n\nconst CheckIcon = (props: React.SVGProps<SVGSVGElement>) => {\n  return (\n    <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n      <path\n        d=\"M7.5 15.8333L1.66667 10L3.75 7.91667L7.5 11.6667L16.25 3L18.3333 5.08333L7.5 15.8333Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  )\n}\n\nconst checkboxVariants = cva(\n  'border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground disabled:bg-btn-primary-disabled peer shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',\n  {\n    variants: {\n      size: {\n        sm: 'size-[14px]',\n        base: 'size-4',\n        lg: 'size-5',\n      },\n    },\n    defaultVariants: {\n      size: 'base',\n    },\n  }\n)\n\ninterface CheckboxProps\n  extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n    VariantProps<typeof checkboxVariants> {\n  iconClassName?: string\n}\n\nconst Checkbox = React.forwardRef<React.ElementRef<typeof CheckboxPrimitive.Root>, CheckboxProps>(\n  ({ className, size, iconClassName, ...props }, ref) => (\n    <CheckboxPrimitive.Root ref={ref} className={cn(checkboxVariants({ size }), className)} {...props}>\n      <CheckboxPrimitive.Indicator className={cn('flex size-full items-center justify-center text-current')}>\n        <CheckIcon width={16} height={12} className={iconClassName} />\n      </CheckboxPrimitive.Indicator>\n    </CheckboxPrimitive.Root>\n  )\n)\nCheckbox.displayName = 'Checkbox'\n\nexport default Checkbox\nexport type { CheckboxProps }\n"],
+  "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAaM,IAAAI,EAAA,6BAXNC,EAAuB,oBACvBC,EAAmC,uCAGnCC,EAAmB,+BACnBC,EAAuC,oCAGvC,MAAMC,EAAaC,MAEf,OAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA8B,GAAGA,EACjG,mBAAC,QACC,EAAE,wFACF,KAAK,eACP,EACF,EAIEC,KAAmB,OACvB,0UACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,KAAM,SACN,GAAI,QACN,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAQMC,EAAWP,EAAM,WACrB,CAAC,CAAE,UAAAQ,EAAW,KAAAC,EAAM,cAAAC,EAAe,GAAGL,CAAM,EAAGM,OAC7C,OAACV,EAAkB,KAAlB,CAAuB,IAAKU,EAAK,aAAW,MAAGL,EAAiB,CAAE,KAAAG,CAAK,CAAC,EAAGD,CAAS,EAAI,GAAGH,EAC1F,mBAACJ,EAAkB,UAAlB,CAA4B,aAAW,MAAG,yDAAyD,EAClG,mBAACG,EAAA,CAAU,MAAO,GAAI,OAAQ,GAAI,UAAWM,EAAe,EAC9D,EACF,CAEJ,EACAH,EAAS,YAAc,WAEvB,IAAOV,EAAQU",
+  "names": ["checkbox_exports", "__export", "checkbox_default", "__toCommonJS", "import_jsx_runtime", "React", "CheckboxPrimitive", "import_helpers", "import_class_variance_authority", "CheckIcon", "props", "checkboxVariants", "Checkbox", "className", "size", "iconClassName", "ref"]
 }

package/dist/esm/biz-components/AiuiProvider/index.d.ts

@@ -3,6 +3,10 @@ interface AiuiContextType {
     trackingData: Record<string, any>;
     locale?: string;
     copyWriting?: Record<string, string>;
+    pathname?: string;
+    storeDomain?: string;
+    isLogin?: boolean;
+    currencyCode?: string;
 }
 export declare const AiuiContext: React.Context<AiuiContextType>;
 export declare const useAiuiContext: () => AiuiContextType;

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

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

package/dist/esm/biz-components/AiuiProvider/index.js.map

@@ -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}\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": "AA+ES,cAAAA,MAAA,oBA/ET,OAAS,WAAAC,MAAe,wBACxB,OAAgB,iBAAAC,EAAe,cAAAC,EAAY,aAAAC,MAAiB,QAQrD,MAAMC,EAAcH,EAA+B,CACxD,aAAc,CAAC,EACf,OAAQ,OACR,YAAa,CAAC,CAChB,CAAC,EAEYI,EAAiB,IAAM,CAElC,GAAI,CADYH,EAAWE,CAAW,EAEpC,MAAM,IAAI,MAAM,wCAAwC,EAE1D,OAAOF,EAAWE,CAAW,CAC/B,EAEME,EAAe,CAAC,CACpB,SAAAC,EACA,GAAGC,CACL,KAGEL,EAAU,IAAM,CACd,MAAMM,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,EACnEZ,EAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,WAAYQ,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,QAAS,GAAKF,EAAiB,EAAGE,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,QAAS,GAAKF,EAAiB,EAAGE,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,EACM,IAAMQ,EAAS,WAAW,CACnC,EAAG,CAAC,CAAC,EAEEpB,EAACK,EAAY,SAAZ,CAAqB,MAAOI,EAAO,SAAAD,EAAS,GAGtD,IAAOa,EAAQd",
+  "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": "AAmFS,cAAAA,MAAA,oBAnFT,OAAS,WAAAC,MAAe,wBACxB,OAAgB,iBAAAC,EAAe,cAAAC,EAAY,aAAAC,MAAiB,QAYrD,MAAMC,EAAcH,EAA+B,CACxD,aAAc,CAAC,EACf,OAAQ,OACR,YAAa,CAAC,CAChB,CAAC,EAEYI,EAAiB,IAAM,CAElC,GAAI,CADYH,EAAWE,CAAW,EAEpC,MAAM,IAAI,MAAM,wCAAwC,EAE1D,OAAOF,EAAWE,CAAW,CAC/B,EAEME,EAAe,CAAC,CACpB,SAAAC,EACA,GAAGC,CACL,KAGEL,EAAU,IAAM,CACd,MAAMM,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,EACnEZ,EAAQ,CACN,MAAO,WACP,WAAY,kBACZ,iBAAkB,CAChB,WAAYQ,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,QAAS,GAAKF,EAAiB,EAAGE,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,QAAS,GAAKF,EAAiB,EAAGE,CAAE,CAAC,EACzDA,EAAG,aAAa,4BAA6B,MAAM,EAEvD,CAAC,EACM,IAAMQ,EAAS,WAAW,CACnC,EAAG,CAAC,CAAC,EAEEpB,EAACK,EAAY,SAAZ,CAAqB,MAAOI,EAAO,SAAAD,EAAS,GAGtD,IAAOa,EAAQd",
   "names": ["jsx", "gaTrack", "createContext", "useContext", "useEffect", "AiuiContext", "useAiuiContext", "AiuiProvider", "children", "rest", "handleTrackClick", "e", "el", "out", "attr", "name", "sku", "nameType", "titleDesc", "navPosition", "observer", "AiuiProvider_default"]
 }

package/dist/esm/biz-components/HeroBanner/Countdown.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type Props = {
+    endDate: string;
+    endDate_tz?: string;
+    locale?: string;
+    onExpire?: () => void;
+};
+export declare const CountdownByEndDate: React.FC<Props>;
+export default CountdownByEndDate;

package/dist/esm/biz-components/HeroBanner/Countdown.js

@@ -0,0 +1,2 @@
+"use client";import{jsx as t,jsxs as a}from"react/jsx-runtime";import{cn as i}from"../../helpers/index.js";import{useEffect as N,useRef as R,useState as T}from"react";const n=(o,l=2)=>String(Math.abs(o)).padStart(l,"0"),r="h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box",d="lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold",F=({endDate:o,endDate_tz:l,locale:b,onExpire:u})=>{const s=R(Date.parse(o)),[w,f]=T(()=>{const e=s.current;return isNaN(e)?0:Math.max(0,e-Date.now())});N(()=>{s.current=Date.parse(o),f(isNaN(s.current)?0:Math.max(0,s.current-Date.now()))},[o]),N(()=>{if(isNaN(s.current))return;let e=!1;const m=()=>{const I=Date.now(),h=Math.max(0,s.current-I);f(h),h<=0&&!e&&(e=!0,u?.())};m();const C=window.setInterval(m,1e3);return()=>clearInterval(C)},[u]);const p=Math.floor(w/1e3),M=p%60,v=Math.floor(p/60),D=v%60,x=Math.floor(v/60),y=x%24,S=Math.floor(x/24),k=l||Intl.DateTimeFormat().resolvedOptions().timeZone;let g="\u2014";const c=s.current;if(!isNaN(c))try{const e=new Date(c);g=new Intl.DateTimeFormat(b||navigator.language,{timeZone:k,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"}).format(e)}catch{g=new Date(c).toISOString()}return a("div",{className:"w-full flex gap-1 items-center","aria-live":"polite",children:[a("div",{className:i(r,"time-days-box"),children:[t("p",{className:d,children:n(S,2)}),t("div",{children:"Day"})]}),t("div",{className:"text-2xl font-bold text-info-white",children:":"}),a("div",{className:i(r,"time-hours-box"),children:[t("p",{className:d,children:n(y,2)}),t("div",{children:"Hours"})]}),t("div",{className:"text-2xl font-bold text-info-white",children:":"}),a("div",{className:i(r,"time-minutes-box"),children:[t("p",{className:d,children:n(D,2)}),t("div",{children:"Mins"})]}),t("div",{className:"text-2xl font-bold text-info-white",children:":"}),a("div",{className:i(r,"time-seconds-box"),children:[t("p",{className:d,children:n(M,2)}),t("div",{children:"Secs"})]})]})};var O=F;export{F as CountdownByEndDate,O as default};
+//# sourceMappingURL=Countdown.js.map

package/dist/esm/biz-components/HeroBanner/Countdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/HeroBanner/Countdown.tsx"],
+  "sourcesContent": ["'use client'\nimport { cn } from '../../helpers/index.js'\nimport React, { useEffect, useRef, useState } from 'react'\n\ntype Props = {\n  endDate: string // ISO UTC \u5B57\u7B26\u4E32\uFF0C\u4F8B\u5982 \"2025-11-02T07:42:00.000Z\"\n  endDate_tz?: string // \u65F6\u533A\uFF0C\u4F8B\u5982 \"Asia/Dhaka\"\uFF08\u53EF\u9009\uFF09\n  locale?: string // \u683C\u5F0F\u5316\u7528\u7684 locale\uFF0C\u9ED8\u8BA4 navigator.language\n  onExpire?: () => void // \u5230\u671F\u56DE\u8C03\uFF08\u53EF\u9009\uFF09\n}\n\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\nconst baseClass =\n  'h-full text-center bg-info-white text-xs text-info-primary lg-desktop:p-1 p-0.5 font-semibold border-box'\n\nconst textClass = 'lg-desktop:text-2xl lg-desktop:h-7 text-xl h-6 lg-desktop:w-10 w-9 font-bold'\n\nexport const CountdownByEndDate: React.FC<Props> = ({ endDate, endDate_tz, locale, onExpire }) => {\n  // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\uFF08\u4F7F\u7528 provided ISO\uFF0C\u82E5\u975E\u6CD5\u5219\u4E3A NaN\uFF09\n  const targetMsRef = useRef<number>(Date.parse(endDate))\n  const [remainingMs, setRemainingMs] = useState<number>(() => {\n    const t = targetMsRef.current\n    return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n  })\n\n  // \u82E5 props.endDate \u6539\u53D8\uFF0C\u66F4\u65B0 ref \u4E0E remaining\n  useEffect(() => {\n    targetMsRef.current = Date.parse(endDate)\n    setRemainingMs(isNaN(targetMsRef.current) ? 0 : Math.max(0, targetMsRef.current - Date.now()))\n  }, [endDate])\n\n  // Tick \u6BCF\u79D2\u66F4\u65B0\u5269\u4F59\u65F6\u95F4\n  useEffect(() => {\n    if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\u8BA1\u65F6\u5668\n    let expiredCalled = false\n    const tick = () => {\n      const now = Date.now()\n      const rem = Math.max(0, targetMsRef.current - now)\n      setRemainingMs(rem)\n      if (rem <= 0 && !expiredCalled) {\n        expiredCalled = true\n        onExpire?.()\n      }\n    }\n    tick() // \u7ACB\u5373\u540C\u6B65\u4E00\u6B21\n    const id = window.setInterval(tick, 1000)\n    return () => clearInterval(id)\n  }, [onExpire])\n\n  // \u8BA1\u7B97\u5929/\u65F6/\u5206/\u79D2\n  const totalSeconds = Math.floor(remainingMs / 1000)\n  const seconds = totalSeconds % 60\n  const totalMinutes = Math.floor(totalSeconds / 60)\n  const minutes = totalMinutes % 60\n  const totalHours = Math.floor(totalMinutes / 60)\n  const hours = totalHours % 24\n  const days = Math.floor(totalHours / 24)\n\n  // \u683C\u5F0F\u5316\u76EE\u6807\u65F6\u95F4\u5E76\u663E\u793A\u5176\u65F6\u533A\uFF08\u4F7F\u7528 endDate_tz \u6216\u8005\u6D4F\u89C8\u5668\u65F6\u533A\uFF09\n  const displayTz = endDate_tz || Intl.DateTimeFormat().resolvedOptions().timeZone\n  let formattedTarget = '\u2014'\n  const tms = targetMsRef.current\n  if (!isNaN(tms)) {\n    try {\n      const dt = new Date(tms)\n      const fmt = new Intl.DateTimeFormat(locale || navigator.language, {\n        timeZone: displayTz,\n        year: 'numeric',\n        month: '2-digit',\n        day: '2-digit',\n        hour: '2-digit',\n        minute: '2-digit',\n        second: '2-digit',\n      })\n      formattedTarget = fmt.format(dt)\n    } catch (e) {\n      // \u82E5\u4F20\u5165\u4E86\u975E\u6CD5\u65F6\u533A\uFF0CIntl \u53EF\u80FD\u629B\u9519\uFF1B\u56DE\u9000\u663E\u793A UTC \u65F6\u95F4\n      formattedTarget = new Date(tms).toISOString()\n    }\n  }\n\n  return (\n    <div className=\"w-full flex gap-1 items-center\" aria-live=\"polite\">\n      {/* \u5929 */}\n      <div className={cn(baseClass, 'time-days-box')}>\n        <p className={textClass}>{pad(days, 2)}</p>\n        <div>Day</div>\n      </div>\n      <div className=\"text-2xl font-bold text-info-white\">:</div>\n      {/* \u65F6 */}\n      <div className={cn(baseClass, 'time-hours-box')}>\n        <p className={textClass}>{pad(hours, 2)}</p>\n        <div>Hours</div>\n      </div>\n      <div className=\"text-2xl font-bold text-info-white\">:</div>\n      {/* \u5206 */}\n      <div className={cn(baseClass, 'time-minutes-box')}>\n        <p className={textClass}>{pad(minutes, 2)}</p>\n        <div>Mins</div>\n      </div>\n      <div className=\"text-2xl font-bold text-info-white\">:</div>\n      {/* \u79D2 */}\n      <div className={cn(baseClass, 'time-seconds-box')}>\n        <p className={textClass}>{pad(seconds, 2)}</p>\n        <div>Secs</div>\n      </div>\n    </div>\n  )\n}\n\nexport default CountdownByEndDate\n"],
+  "mappings": "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",
+  "names": ["jsx", "jsxs", "cn", "useEffect", "useRef", "useState", "pad", "n", "len", "baseClass", "textClass", "CountdownByEndDate", "endDate", "endDate_tz", "locale", "onExpire", "targetMsRef", "remainingMs", "setRemainingMs", "t", "expiredCalled", "tick", "now", "rem", "id", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "displayTz", "formattedTarget", "tms", "dt", "Countdown_default"]
+}

package/dist/esm/biz-components/HeroBanner/HeroBanner.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import D,{useImperativeHandle as J,useRef as m,useState as K,useEffect as O}from"react";import f from"gsap";import{ScrollTrigger as x}from"gsap/dist/ScrollTrigger";import{useMediaQuery as _}from"react-responsive";import{useInView as W}from"react-intersection-observer";import X from"../../helpers/ScrollLoadVideo.js";import{Button as H,Heading as j,Picture as Y,Text as ee}from"../../components/index.js";import{cn as i}from"../../helpers/index.js";import{withLayout as te}from"../../shared/Styles.js";import{useExposure as ae}from"../../hooks/useExposure.js";import{trackUrlRef as V}from"../../shared/trackUrlRef.js";import{sizeMap as re}from"../../components/button.js";import{VideoModal as oe}from"../VideoModal/index.js";const o="image",l="hero_banner",le=({size:h="base"})=>{const{width:y,height:v}=re[h];return e("svg",{width:y,height:v,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},q=D.forwardRef(({data:h,className:y},v)=>{const{title:t,subtitle:a,pcImage:w,padImage:z,mobileImage:g,pcVideo:F,padVideo:A,mobileVideo:R,isShowVideo:Q,primaryButton:p,secondaryButton:r,theme:Z="light",size:I="default",caption:$=[],blockLink:P}=h,M=_({query:"(max-width: 768px)"}),L=_({query:"(max-width: 1024px)"}),[S,C]=K(!1),{ref:G,inView:E}=W(),k=m(null),N=m(null),T=m(null),c=m(null),s=m(null);return ae(s,{componentType:o,componentName:l,componentTitle:t,componentDescription:a}),J(v,()=>s.current),O(()=>{f.registerPlugin(x);function B(){if(!c.current)return;const b=s.current?.clientHeight||100;window.innerHeight<=b?k.current=x.create({trigger:s.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:u=>{const d=u.progress*40-20;f.set(c.current,{yPercent:d})}}):(T.current=x.create({trigger:s.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:u=>{const d=u.progress*20-20;f.set(c.current,{yPercent:d})}}),N.current=x.create({trigger:s.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:u=>{const d=u.progress*20;f.set(c.current,{yPercent:d})}}))}return E&&B(),()=>{k.current&&k.current.kill(),T.current&&T.current.kill(),N.current&&N.current.kill()}},[E]),e("div",{ref:G,"data-ui-component-id":"HeroBanner",children:n("div",{ref:s,className:i(Z==="dark"?"aiui-dark":""," tablet:aspect-[768/660] text-info-primary relative aspect-[390/660] w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520]":I==="default","lg-desktop:aspect-[1920/720] desktop:aspect-[1440/576] laptop:aspect-[1024/432]":I==="sm"},y),children:[P&&e("a",{className:"absolute inset-0 z-10",href:V(P,`${o}_${l}`),"data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}`,tabIndex:-1,"aria-hidden":"true","aria-label":t}),e("div",{ref:c,className:i("absolute left-0 top-0 size-full"),children:Q?e(X,{poster:M?g?.url:L?z?.url||g?.url:w?.url,src:M?R?.url:L?A?.url||R?.url:F?.url,className:"laptop:w-full h-full",videoClassName:"h-full object-cover",muted:!0,loop:!0,playsInline:!0}):e(Y,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:w?.alt||"",source:`${w?.url||""} , ${z?.url??(g?.url||"")} 1024, ${g?.url||""} 767`})}),n("div",{className:"hero-banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] lg-desktop:gap-[32px] absolute top-24 z-10 flex flex-col gap-[24px] px-[16px]",children:[n("div",{className:"laptop:text-left max-w-[686px]",children:[t&&e(j,{as:"h2",size:5,className:i("hero-banner-title"),html:t}),a&&e(j,{as:"h3",className:i("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm"),html:a})]}),n("div",{className:"hero-banner-button-group laptop:justify-start lg-desktop:gap-3 flex items-center gap-2",children:[r?.isShowPlayVideoButton&&r?.playVideoButtonText?n(H,{onClick:()=>C(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}#${r?.playVideoButtonText}`,children:[r?.playVideoButtonText," ",e(le,{size:"lg"})]}):r?.text?n(H,{"aria-label":t??a,size:"lg",variant:"secondary",className:"hero-banner-secondary-button",as:"a",href:V(r?.link,`${o}_${l}`),"data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}#${r?.text}`,children:[r?.text,e("span",{className:"sr-only",children:t??a})]}):null,p&&p.text&&e(H,{"aria-label":t??a,size:"lg",variant:"primary",className:"hero-banner-primary-button",as:"a",href:V(p.link,`${o}_${l}`),"data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}#${p?.text}`,children:p.text})]})]}),$.length>0&&e("div",{className:"hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",children:$.map((B,b)=>n(D.Fragment,{children:[e(ee,{size:2,className:i("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:B.title}),b<$.length-1&&e("div",{className:i("bg-info-primary w-px")})]},b))}),S&&e(oe,{visible:S,videoUrl:r?.videoUrl?.url,youTubeId:r?.youtubeId,onCloseModal:()=>C(!1)})]})})});q.displayName="HeroBanner";var ve=te(q);export{ve as default};
+"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import _,{useImperativeHandle as X,useRef as b,useState as Y,useEffect as ee}from"react";import h from"gsap";import{ScrollTrigger as x}from"gsap/dist/ScrollTrigger";import{useMediaQuery as j}from"react-responsive";import{useInView as te}from"react-intersection-observer";import ae from"../../helpers/ScrollLoadVideo.js";import{Button as H,Heading as q,Picture as A,Text as re}from"../../components/index.js";import oe from"./Countdown.js";import{cn as c}from"../../helpers/index.js";import{withLayout as le}from"../../shared/Styles.js";import{useExposure as se}from"../../hooks/useExposure.js";import{trackUrlRef as V}from"../../shared/trackUrlRef.js";import{sizeMap as ne}from"../../components/button.js";import{VideoModal as ie}from"../VideoModal/index.js";const o="image",l="hero_banner",pe=({size:v="base"})=>{const{width:y,height:w}=ne[v];return e("svg",{width:y,height:w,viewBox:"0 0 20 20",fill:"currentcolor",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z",fill:"currentcolor"})})},F=_.forwardRef(({data:v,className:y},w)=>{const{title:t,subtitle:a,endDate:I,endDate_tz:Q,pcImage:$,padImage:R,mobileImage:f,pcVideo:Z,padVideo:G,mobileVideo:P,isShowVideo:J,primaryButton:u,secondaryButton:r,theme:K="light",size:k="default",caption:N=[],blockLink:M,iconArray:O}=v,C=j({query:"(max-width: 768px)"}),L=j({query:"(max-width: 1024px)"}),[D,S]=Y(!1),{ref:W,inView:E}=te(),T=b(null),B=b(null),z=b(null),d=b(null),s=b(null);return se(s,{componentType:o,componentName:l,componentTitle:t,componentDescription:a}),X(w,()=>s.current),ee(()=>{h.registerPlugin(x);function i(){if(!d.current)return;const p=s.current?.clientHeight||100;window.innerHeight<=p?T.current=x.create({trigger:s.current,start:"top bottom",end:"bottom top",scrub:!0,onUpdate:m=>{const g=m.progress*40-20;h.set(d.current,{yPercent:g})}}):(z.current=x.create({trigger:s.current,start:"top bottom",end:"bottom bottom",scrub:!0,onUpdate:m=>{const g=m.progress*20-20;h.set(d.current,{yPercent:g})}}),B.current=x.create({trigger:s.current,start:"top top",end:"bottom top",scrub:!0,onUpdate:m=>{const g=m.progress*20;h.set(d.current,{yPercent:g})}}))}return E&&i(),()=>{T.current&&T.current.kill(),z.current&&z.current.kill(),B.current&&B.current.kill()}},[E]),e("div",{ref:W,"data-ui-component-id":"HeroBanner",children:n("div",{ref:s,className:c(K==="dark"?"aiui-dark":""," tablet:aspect-[768/660] text-info-primary relative aspect-[390/660] w-full overflow-hidden",{"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520]":k==="default","lg-desktop:aspect-[1920/720] desktop:aspect-[1440/576] laptop:aspect-[1024/432]":k==="sm"},y),children:[M&&e("a",{className:"absolute inset-0 z-10",href:V(M,`${o}_${l}`),"data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}`,tabIndex:-1,"aria-hidden":"true","aria-label":t}),e("div",{ref:d,className:c("absolute left-0 top-0 size-full"),children:J?e(ae,{poster:C?f?.url:L?R?.url||f?.url:$?.url,src:C?P?.url:L?G?.url||P?.url:Z?.url,className:"laptop:w-full h-full",videoClassName:"h-full object-cover",muted:!0,loop:!0,playsInline:!0}):e(A,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",fetchPriority:"high",alt:$?.alt||"",source:`${$?.url||""} , ${R?.url??(f?.url||"")} 1024, ${f?.url||""} 767`})}),n("div",{className:"hero-banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] lg-desktop:gap-[32px] absolute top-24 z-10 flex flex-col gap-[24px] px-[16px]",children:[n("div",{className:"laptop:text-left max-w-[686px]",children:[t&&e(q,{as:"h2",size:k==="sm"?4:5,className:c("hero-banner-title"),html:t}),a&&e(q,{as:"h3",className:c("hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm"),html:a}),I&&e("div",{className:"mt-3",children:e(oe,{endDate:I,endDate_tz:Q})})]}),n("div",{className:"hero-banner-button-group laptop:justify-start lg-desktop:gap-3 flex items-center gap-2",children:[r?.isShowPlayVideoButton&&r?.playVideoButtonText?n(H,{onClick:()=>S(!0),size:"lg",variant:"secondary",className:"hero-banner-play-video-button","data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}#${r?.playVideoButtonText}`,children:[r?.playVideoButtonText," ",e(pe,{size:"lg"})]}):r?.text?n(H,{"aria-label":t??a,size:"lg",variant:"secondary",className:"hero-banner-secondary-button",as:"a",href:V(r?.link,`${o}_${l}`),"data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}#${r?.text}`,children:[r?.text,e("span",{className:"sr-only",children:t??a})]}):null,u&&u.text&&e(H,{"aria-label":t??a,size:"lg",variant:"primary",className:"hero-banner-primary-button",as:"a",href:V(u.link,`${o}_${l}`),"data-headless-type-name":`${o}#${l}`,"data-headless-title-desc-button":`${t}#${a}#${u?.text}`,children:u.text})]}),e("div",{className:"hero-banner-icon-group flex items-center gap-2",children:O?.map((i,p)=>e("div",{className:"h-12",children:e(A,{className:"laptop:w-full h-full",imgClassName:"h-full object-cover",loading:"eager",alt:i?.pcImage?.alt||"",source:i?.pcImage?.url})},p))})]}),N.length>0&&e("div",{className:"hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]",children:N.map((i,p)=>n(_.Fragment,{children:[e(re,{size:2,className:c("hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]"),html:i.title}),p<N.length-1&&e("div",{className:c("bg-info-primary w-px")})]},p))}),D&&e(ie,{visible:D,videoUrl:r?.videoUrl?.url,youTubeId:r?.youtubeId,onCloseModal:()=>S(!1)})]})})});F.displayName="HeroBanner";var Te=le(F);export{Te as default};
 //# sourceMappingURL=HeroBanner.js.map

package/dist/esm/biz-components/HeroBanner/HeroBanner.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/biz-components/HeroBanner/HeroBanner.tsx"],
-  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState, useEffect } from 'react'\nimport gsap from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport type { HeroBannerProps } from './types.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useInView } from 'react-intersection-observer'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { Button, Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { sizeMap } from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\n\nconst componentType = 'image'\nconst componentName = 'hero_banner'\n\nconst PlayButtonAppendIcon = ({ size = 'base' }: { size: 'base' | 'lg' | 'sm' }) => {\n  const { width, height } = sizeMap[size]\n  return (\n    <svg width={width} height={height} viewBox=\"0 0 20 20\" fill=\"currentcolor\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z\"\n        fill=\"currentcolor\"\n      />\n    </svg>\n  )\n}\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(({ data, className }, ref) => {\n  const {\n    title,\n    subtitle,\n    pcImage,\n    padImage,\n    mobileImage,\n    pcVideo,\n    padVideo,\n    mobileVideo,\n    isShowVideo,\n    primaryButton,\n    secondaryButton,\n    theme = 'light',\n    size = 'default',\n    caption = [],\n    blockLink,\n  } = data\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  const isPad = useMediaQuery({ query: '(max-width: 1024px)' })\n  const [visible, setVisible] = useState<boolean>(false)\n  const { ref: inViewRef, inView } = useInView()\n  const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n  const bgTriggerRef = useRef<ScrollTrigger | null>(null)\n  const boxTriggerRef = useRef<ScrollTrigger | null>(null)\n\n  const bgRef = useRef<HTMLImageElement>(null)\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n    componentDescription: subtitle,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  useEffect(() => {\n    gsap.registerPlugin(ScrollTrigger)\n    function gsapResize() {\n      if (!bgRef.current) return\n      const clientHeight = boxRef.current?.clientHeight || 100\n      const screenHeight = window.innerHeight\n\n      if (screenHeight <= clientHeight) {\n        scrollTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 40\n            const value = self.progress * base - base / 2\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      } else {\n        boxTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom bottom',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base - base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n        bgTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top top',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      }\n    }\n    if (inView) gsapResize()\n    return () => {\n      // ScrollTrigger.getAll().forEach((t: any) => t.kill())\n      scrollTriggerRef.current && scrollTriggerRef.current.kill()\n      boxTriggerRef.current && boxTriggerRef.current.kill()\n      bgTriggerRef.current && bgTriggerRef.current.kill()\n    }\n  }, [inView])\n\n  return (\n    <div ref={inViewRef} data-ui-component-id=\"HeroBanner\">\n      <div\n        ref={boxRef}\n        className={cn(\n          theme === 'dark' ? 'aiui-dark' : '',\n          ' tablet:aspect-[768/660] text-info-primary relative aspect-[390/660] w-full overflow-hidden',\n          {\n            'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520]': size === 'default',\n            'lg-desktop:aspect-[1920/720] desktop:aspect-[1440/576] laptop:aspect-[1024/432]': size === 'sm',\n          },\n          className\n        )}\n      >\n        {blockLink && (\n          <a\n            className=\"absolute inset-0 z-10\"\n            href={trackUrlRef(blockLink, `${componentType}_${componentName}`)}\n            data-headless-type-name={`${componentType}#${componentName}`}\n            data-headless-title-desc-button={`${title}#${subtitle}`}\n            tabIndex={-1}\n            aria-hidden=\"true\"\n            aria-label={title}\n          ></a>\n        )}\n        <div ref={bgRef} className={cn('absolute left-0 top-0 size-full')}>\n          {isShowVideo ? (\n            <ScrollLoadVideo\n              poster={isMobile ? mobileImage?.url : isPad ? padImage?.url || mobileImage?.url : pcImage?.url}\n              src={\n                isMobile\n                  ? (mobileVideo?.url as string)\n                  : isPad\n                    ? (padVideo?.url as string) || (mobileVideo?.url as string)\n                    : (pcVideo?.url as string)\n              }\n              className=\"laptop:w-full h-full\"\n              videoClassName=\"h-full object-cover\"\n              muted\n              loop\n              playsInline\n            />\n          ) : (\n            <Picture\n              className=\"laptop:w-full h-full\"\n              imgClassName=\"h-full object-cover\"\n              loading=\"eager\"\n              fetchPriority=\"high\"\n              alt={pcImage?.alt || ''}\n              source={`${pcImage?.url || ''} , ${padImage?.url ?? (mobileImage?.url || '')} 1024, ${mobileImage?.url || ''} 767`}\n            />\n          )}\n        </div>\n\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className=\"hero-banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] lg-desktop:gap-[32px] absolute top-24 z-10 flex flex-col gap-[24px] px-[16px]\">\n          <div className=\"laptop:text-left max-w-[686px]\">\n            {title && <Heading as=\"h2\" size={5} className={cn('hero-banner-title')} html={title} />}\n            {subtitle && (\n              <Heading\n                as=\"h3\"\n                className={cn(\n                  'hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm'\n                )}\n                html={subtitle}\n              />\n            )}\n          </div>\n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"hero-banner-button-group laptop:justify-start lg-desktop:gap-3 flex items-center gap-2\">\n            {secondaryButton?.isShowPlayVideoButton && secondaryButton?.playVideoButtonText ? (\n              <Button\n                onClick={() => setVisible(true)}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-play-video-button\"\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.playVideoButtonText}`}\n              >\n                {secondaryButton?.playVideoButtonText} <PlayButtonAppendIcon size=\"lg\" />\n              </Button>\n            ) : secondaryButton?.text ? (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-secondary-button\"\n                as=\"a\"\n                href={trackUrlRef(secondaryButton?.link, `${componentType}_${componentName}`)}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.text}`}\n              >\n                {secondaryButton?.text}\n                <span className=\"sr-only\">{title ?? subtitle}</span>\n              </Button>\n            ) : null}\n            {primaryButton && primaryButton.text && (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"primary\"\n                className=\"hero-banner-primary-button\"\n                as=\"a\"\n                href={trackUrlRef(primaryButton.link, `${componentType}_${componentName}`)}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${primaryButton?.text}`}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {caption.length > 0 && (\n          <div className=\"hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]\">\n            {caption.map((c, index) => (\n              <React.Fragment key={index}>\n                <Text\n                  size={2}\n                  className={cn(\n                    'hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]'\n                  )}\n                  html={c.title}\n                />\n                {index < caption.length - 1 && <div className={cn('bg-info-primary w-px')} />}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n\n        {/* \u89C6\u9891\u5F39\u7A97 */}\n        {visible && (\n          <VideoModal\n            visible={visible}\n            videoUrl={secondaryButton?.videoUrl?.url}\n            youTubeId={secondaryButton?.youtubeId}\n            onCloseModal={() => setVisible(false)}\n          />\n        )}\n      </div>\n    </div>\n  )\n})\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withLayout(HeroBanner)\n"],
-  "mappings": "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",
-  "names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "useState", "useEffect", "gsap", "ScrollTrigger", "useMediaQuery", "useInView", "ScrollLoadVideo", "Button", "Heading", "Picture", "Text", "cn", "withLayout", "useExposure", "trackUrlRef", "sizeMap", "VideoModal", "componentType", "componentName", "PlayButtonAppendIcon", "size", "width", "height", "HeroBanner", "data", "className", "ref", "title", "subtitle", "pcImage", "padImage", "mobileImage", "pcVideo", "padVideo", "mobileVideo", "isShowVideo", "primaryButton", "secondaryButton", "theme", "caption", "blockLink", "isMobile", "isPad", "visible", "setVisible", "inViewRef", "inView", "scrollTriggerRef", "bgTriggerRef", "boxTriggerRef", "bgRef", "boxRef", "gsapResize", "clientHeight", "self", "value", "c", "index", "HeroBanner_default"]
+  "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState, useEffect } from 'react'\nimport gsap from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport type { HeroBannerProps } from './types.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { useInView } from 'react-intersection-observer'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { Button, Heading, Picture, Text } from '../../components/index.js'\nimport Countdown from './Countdown.js'\nimport { cn } from '../../helpers/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { sizeMap } from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\n\nconst componentType = 'image'\nconst componentName = 'hero_banner'\n\nconst PlayButtonAppendIcon = ({ size = 'base' }: { size: 'base' | 'lg' | 'sm' }) => {\n  const { width, height } = sizeMap[size]\n  return (\n    <svg width={width} height={height} viewBox=\"0 0 20 20\" fill=\"currentcolor\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M13.9599 9.30662C14.4547 9.63647 14.4547 10.3635 13.9599 10.6934L6.29558 15.8029C5.74179 16.1721 5 15.7751 5 15.1096V4.89042C5 4.22484 5.74179 3.82785 6.29558 4.19705L13.9599 9.30662Z\"\n        fill=\"currentcolor\"\n      />\n    </svg>\n  )\n}\n\nconst HeroBanner = React.forwardRef<HTMLDivElement, HeroBannerProps>(({ data, className }, ref) => {\n  const {\n    title,\n    subtitle,\n    endDate,\n    endDate_tz,\n    pcImage,\n    padImage,\n    mobileImage,\n    pcVideo,\n    padVideo,\n    mobileVideo,\n    isShowVideo,\n    primaryButton,\n    secondaryButton,\n    theme = 'light',\n    size = 'default',\n    caption = [],\n    blockLink,\n    iconArray,\n  } = data\n\n  const isMobile = useMediaQuery({ query: '(max-width: 768px)' })\n  const isPad = useMediaQuery({ query: '(max-width: 1024px)' })\n  const [visible, setVisible] = useState<boolean>(false)\n  const { ref: inViewRef, inView } = useInView()\n  const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n  const bgTriggerRef = useRef<ScrollTrigger | null>(null)\n  const boxTriggerRef = useRef<ScrollTrigger | null>(null)\n\n  const bgRef = useRef<HTMLImageElement>(null)\n  const boxRef = useRef<HTMLDivElement>(null)\n\n  useExposure(boxRef, {\n    componentType,\n    componentName,\n    componentTitle: title,\n    componentDescription: subtitle,\n  })\n\n  useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n  useEffect(() => {\n    gsap.registerPlugin(ScrollTrigger)\n    function gsapResize() {\n      if (!bgRef.current) return\n      const clientHeight = boxRef.current?.clientHeight || 100\n      const screenHeight = window.innerHeight\n\n      if (screenHeight <= clientHeight) {\n        scrollTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 40\n            const value = self.progress * base - base / 2\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      } else {\n        boxTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top bottom',\n          end: 'bottom bottom',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base - base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n        bgTriggerRef.current = ScrollTrigger.create({\n          trigger: boxRef.current,\n          start: 'top top',\n          end: 'bottom top',\n          scrub: true,\n          onUpdate: (self: any) => {\n            const base = 20\n            const value = self.progress * base\n            gsap.set(bgRef.current, { yPercent: value })\n          },\n        })\n      }\n    }\n    if (inView) gsapResize()\n    return () => {\n      // ScrollTrigger.getAll().forEach((t: any) => t.kill())\n      scrollTriggerRef.current && scrollTriggerRef.current.kill()\n      boxTriggerRef.current && boxTriggerRef.current.kill()\n      bgTriggerRef.current && bgTriggerRef.current.kill()\n    }\n  }, [inView])\n\n  return (\n    <div ref={inViewRef} data-ui-component-id=\"HeroBanner\">\n      <div\n        ref={boxRef}\n        className={cn(\n          theme === 'dark' ? 'aiui-dark' : '',\n          ' tablet:aspect-[768/660] text-info-primary relative aspect-[390/660] w-full overflow-hidden',\n          {\n            'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520]': size === 'default',\n            'lg-desktop:aspect-[1920/720] desktop:aspect-[1440/576] laptop:aspect-[1024/432]': size === 'sm',\n          },\n          className\n        )}\n      >\n        {blockLink && (\n          <a\n            className=\"absolute inset-0 z-10\"\n            href={trackUrlRef(blockLink, `${componentType}_${componentName}`)}\n            data-headless-type-name={`${componentType}#${componentName}`}\n            data-headless-title-desc-button={`${title}#${subtitle}`}\n            tabIndex={-1}\n            aria-hidden=\"true\"\n            aria-label={title}\n          ></a>\n        )}\n        <div ref={bgRef} className={cn('absolute left-0 top-0 size-full')}>\n          {isShowVideo ? (\n            <ScrollLoadVideo\n              poster={isMobile ? mobileImage?.url : isPad ? padImage?.url || mobileImage?.url : pcImage?.url}\n              src={\n                isMobile\n                  ? (mobileVideo?.url as string)\n                  : isPad\n                    ? (padVideo?.url as string) || (mobileVideo?.url as string)\n                    : (pcVideo?.url as string)\n              }\n              className=\"laptop:w-full h-full\"\n              videoClassName=\"h-full object-cover\"\n              muted\n              loop\n              playsInline\n            />\n          ) : (\n            <Picture\n              className=\"laptop:w-full h-full\"\n              imgClassName=\"h-full object-cover\"\n              loading=\"eager\"\n              fetchPriority=\"high\"\n              alt={pcImage?.alt || ''}\n              source={`${pcImage?.url || ''} , ${padImage?.url ?? (mobileImage?.url || '')} 1024, ${mobileImage?.url || ''} 767`}\n            />\n          )}\n        </div>\n\n        {/* \u5185\u5BB9\u533A\u57DF */}\n        <div className=\"hero-banner-content laptop:top-1/2 laptop:-translate-y-1/2 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] lg-desktop:gap-[32px] absolute top-24 z-10 flex flex-col gap-[24px] px-[16px]\">\n          <div className=\"laptop:text-left max-w-[686px]\">\n            {title && <Heading as=\"h2\" size={size === 'sm'? 4 : 5} className={cn('hero-banner-title')} html={title} />}\n            {subtitle && (\n              <Heading\n                as=\"h3\"\n                className={cn(\n                  'hero-banner-subtitle font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm'\n                )}\n                html={subtitle}\n              />\n            )}\n            {endDate && (\n              <div className=\"mt-3\">\n                <Countdown endDate={endDate} endDate_tz={endDate_tz} />\n              </div>\n            )}\n          </div>\n          {/* \u6309\u94AE\u7EC4 */}\n          <div className=\"hero-banner-button-group laptop:justify-start lg-desktop:gap-3 flex items-center gap-2\">\n            {secondaryButton?.isShowPlayVideoButton && secondaryButton?.playVideoButtonText ? (\n              <Button\n                onClick={() => setVisible(true)}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-play-video-button\"\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.playVideoButtonText}`}\n              >\n                {secondaryButton?.playVideoButtonText} <PlayButtonAppendIcon size=\"lg\" />\n              </Button>\n            ) : secondaryButton?.text ? (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"secondary\"\n                className=\"hero-banner-secondary-button\"\n                as=\"a\"\n                href={trackUrlRef(secondaryButton?.link, `${componentType}_${componentName}`)}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${secondaryButton?.text}`}\n              >\n                {secondaryButton?.text}\n                <span className=\"sr-only\">{title ?? subtitle}</span>\n              </Button>\n            ) : null}\n            {primaryButton && primaryButton.text && (\n              <Button\n                aria-label={title ?? subtitle}\n                size=\"lg\"\n                variant=\"primary\"\n                className=\"hero-banner-primary-button\"\n                as=\"a\"\n                href={trackUrlRef(primaryButton.link, `${componentType}_${componentName}`)}\n                data-headless-type-name={`${componentType}#${componentName}`}\n                data-headless-title-desc-button={`${title}#${subtitle}#${primaryButton?.text}`}\n              >\n                {primaryButton.text}\n              </Button>\n            )}\n          </div>\n          <div className=\"hero-banner-icon-group flex items-center gap-2\">\n            {iconArray?.map((icon, index) => (\n              <div key={index} className=\"h-12\">\n                <Picture\n                  className=\"laptop:w-full h-full\"\n                  imgClassName=\"h-full object-cover\"\n                  loading=\"eager\"\n                  alt={icon?.pcImage?.alt || ''}\n                  source={icon?.pcImage?.url}\n                />\n              </div>\n            ))}\n          </div>\n        </div>\n\n        {/* \u5E95\u90E8\u4EA7\u54C1\u5217\u8868 */}\n        {caption.length > 0 && (\n          <div className=\"hero-banner-caption-group laptop:gap-3 tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] desktop:pb-[24px] absolute bottom-0 z-10 flex items-stretch gap-2 px-[16px] pb-[16px]\">\n            {caption.map((c, index) => (\n              <React.Fragment key={index}>\n                <Text\n                  size={2}\n                  className={cn(\n                    'hero-banner-product-text tablet:w-[108px] loptop:w-[150px] desktop:w-[156px] lg-desktop:w-[180px] laptop:text-[14px] flex-1 text-[12px]'\n                  )}\n                  html={c.title}\n                />\n                {index < caption.length - 1 && <div className={cn('bg-info-primary w-px')} />}\n              </React.Fragment>\n            ))}\n          </div>\n        )}\n\n        {/* \u89C6\u9891\u5F39\u7A97 */}\n        {visible && (\n          <VideoModal\n            visible={visible}\n            videoUrl={secondaryButton?.videoUrl?.url}\n            youTubeId={secondaryButton?.youtubeId}\n            onCloseModal={() => setVisible(false)}\n          />\n        )}\n      </div>\n    </div>\n  )\n})\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withLayout(HeroBanner)\n"],
+  "mappings": "aAwBM,cAAAA,EA+JI,QAAAC,MA/JJ,oBAvBN,OAAOC,GAAS,uBAAAC,EAAqB,UAAAC,EAAQ,YAAAC,EAAU,aAAAC,OAAiB,QACxE,OAAOC,MAAU,OACjB,OAAS,iBAAAC,MAAqB,0BAE9B,OAAS,iBAAAC,MAAqB,mBAC9B,OAAS,aAAAC,OAAiB,8BAC1B,OAAOC,OAAqB,mCAC5B,OAAS,UAAAC,EAAQ,WAAAC,EAAS,WAAAC,EAAS,QAAAC,OAAY,4BAC/C,OAAOC,OAAe,iBACtB,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,OAAkB,yBAC3B,OAAS,eAAAC,OAAmB,6BAC5B,OAAS,eAAAC,MAAmB,8BAC5B,OAAS,WAAAC,OAAe,6BACxB,OAAS,cAAAC,OAAkB,yBAE3B,MAAMC,EAAgB,QAChBC,EAAgB,cAEhBC,GAAuB,CAAC,CAAE,KAAAC,EAAO,MAAO,IAAsC,CAClF,KAAM,CAAE,MAAAC,EAAO,OAAAC,CAAO,EAAIP,GAAQK,CAAI,EACtC,OACE1B,EAAC,OAAI,MAAO2B,EAAO,OAAQC,EAAQ,QAAQ,YAAY,KAAK,eAAe,MAAM,6BAC/E,SAAA5B,EAAC,QACC,EAAE,0LACF,KAAK,eACP,EACF,CAEJ,EAEM6B,EAAa3B,EAAM,WAA4C,CAAC,CAAE,KAAA4B,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CACjG,KAAM,CACJ,MAAAC,EACA,SAAAC,EACA,QAAAC,EACA,WAAAC,EACA,QAAAC,EACA,SAAAC,EACA,YAAAC,EACA,QAAAC,EACA,SAAAC,EACA,YAAAC,EACA,YAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,MAAAC,EAAQ,QACR,KAAApB,EAAO,UACP,QAAAqB,EAAU,CAAC,EACX,UAAAC,EACA,UAAAC,CACF,EAAInB,EAEEoB,EAAWzC,EAAc,CAAE,MAAO,oBAAqB,CAAC,EACxD0C,EAAQ1C,EAAc,CAAE,MAAO,qBAAsB,CAAC,EACtD,CAAC2C,EAASC,CAAU,EAAIhD,EAAkB,EAAK,EAC/C,CAAE,IAAKiD,EAAW,OAAAC,CAAO,EAAI7C,GAAU,EACvC8C,EAAmBpD,EAA6B,IAAI,EACpDqD,EAAerD,EAA6B,IAAI,EAChDsD,EAAgBtD,EAA6B,IAAI,EAEjDuD,EAAQvD,EAAyB,IAAI,EACrCwD,EAASxD,EAAuB,IAAI,EAE1C,OAAAe,GAAYyC,EAAQ,CAClB,cAAArC,EACA,cAAAC,EACA,eAAgBS,EAChB,qBAAsBC,CACxB,CAAC,EAED/B,EAAoB6B,EAAK,IAAM4B,EAAO,OAAyB,EAE/DtD,GAAU,IAAM,CACdC,EAAK,eAAeC,CAAa,EACjC,SAASqD,GAAa,CACpB,GAAI,CAACF,EAAM,QAAS,OACpB,MAAMG,EAAeF,EAAO,SAAS,cAAgB,IAChC,OAAO,aAERE,EAClBN,EAAiB,QAAUhD,EAAc,OAAO,CAC9C,QAASoD,EAAO,QAChB,MAAO,aACP,IAAK,aACL,MAAO,GACP,SAAWG,GAAc,CAEvB,MAAMC,EAAQD,EAAK,SAAW,GAAO,GACrCxD,EAAK,IAAIoD,EAAM,QAAS,CAAE,SAAUK,CAAM,CAAC,CAC7C,CACF,CAAC,GAEDN,EAAc,QAAUlD,EAAc,OAAO,CAC3C,QAASoD,EAAO,QAChB,MAAO,aACP,IAAK,gBACL,MAAO,GACP,SAAWG,GAAc,CAEvB,MAAMC,EAAQD,EAAK,SAAW,GAAO,GACrCxD,EAAK,IAAIoD,EAAM,QAAS,CAAE,SAAUK,CAAM,CAAC,CAC7C,CACF,CAAC,EACDP,EAAa,QAAUjD,EAAc,OAAO,CAC1C,QAASoD,EAAO,QAChB,MAAO,UACP,IAAK,aACL,MAAO,GACP,SAAWG,GAAc,CAEvB,MAAMC,EAAQD,EAAK,SAAW,GAC9BxD,EAAK,IAAIoD,EAAM,QAAS,CAAE,SAAUK,CAAM,CAAC,CAC7C,CACF,CAAC,EAEL,CACA,OAAIT,GAAQM,EAAW,EAChB,IAAM,CAEXL,EAAiB,SAAWA,EAAiB,QAAQ,KAAK,EAC1DE,EAAc,SAAWA,EAAc,QAAQ,KAAK,EACpDD,EAAa,SAAWA,EAAa,QAAQ,KAAK,CACpD,CACF,EAAG,CAACF,CAAM,CAAC,EAGTvD,EAAC,OAAI,IAAKsD,EAAW,uBAAqB,aACxC,SAAArD,EAAC,OACC,IAAK2D,EACL,UAAW3C,EACT6B,IAAU,OAAS,YAAc,GACjC,8FACA,CACE,kFAAmFpB,IAAS,UAC5F,kFAAmFA,IAAS,IAC9F,EACAK,CACF,EAEC,UAAAiB,GACChD,EAAC,KACC,UAAU,wBACV,KAAMoB,EAAY4B,EAAW,GAAGzB,CAAa,IAAIC,CAAa,EAAE,EAChE,0BAAyB,GAAGD,CAAa,IAAIC,CAAa,GAC1D,kCAAiC,GAAGS,CAAK,IAAIC,CAAQ,GACrD,SAAU,GACV,cAAY,OACZ,aAAYD,EACb,EAEHjC,EAAC,OAAI,IAAK2D,EAAO,UAAW1C,EAAG,iCAAiC,EAC7D,SAAA0B,EACC3C,EAACW,GAAA,CACC,OAAQuC,EAAWX,GAAa,IAAMY,EAAQb,GAAU,KAAOC,GAAa,IAAMF,GAAS,IAC3F,IACEa,EACKR,GAAa,IACdS,EACGV,GAAU,KAAmBC,GAAa,IAC1CF,GAAS,IAElB,UAAU,uBACV,eAAe,sBACf,MAAK,GACL,KAAI,GACJ,YAAW,GACb,EAEAxC,EAACc,EAAA,CACC,UAAU,uBACV,aAAa,sBACb,QAAQ,QACR,cAAc,OACd,IAAKuB,GAAS,KAAO,GACrB,OAAQ,GAAGA,GAAS,KAAO,EAAE,MAAMC,GAAU,MAAQC,GAAa,KAAO,GAAG,UAAUA,GAAa,KAAO,EAAE,OAC9G,EAEJ,EAGAtC,EAAC,OAAI,UAAU,6MACb,UAAAA,EAAC,OAAI,UAAU,iCACZ,UAAAgC,GAASjC,EAACa,EAAA,CAAQ,GAAG,KAAK,KAAMa,IAAS,KAAM,EAAI,EAAG,UAAWT,EAAG,mBAAmB,EAAG,KAAMgB,EAAO,EACvGC,GACClC,EAACa,EAAA,CACC,GAAG,KACH,UAAWI,EACT,qHACF,EACA,KAAMiB,EACR,EAEDC,GACCnC,EAAC,OAAI,UAAU,OACb,SAAAA,EAACgB,GAAA,CAAU,QAASmB,EAAS,WAAYC,EAAY,EACvD,GAEJ,EAEAnC,EAAC,OAAI,UAAU,yFACZ,UAAA4C,GAAiB,uBAAyBA,GAAiB,oBAC1D5C,EAACW,EAAA,CACC,QAAS,IAAMyC,EAAW,EAAI,EAC9B,KAAK,KACL,QAAQ,YACR,UAAU,gCACV,0BAAyB,GAAG9B,CAAa,IAAIC,CAAa,GAC1D,kCAAiC,GAAGS,CAAK,IAAIC,CAAQ,IAAIW,GAAiB,mBAAmB,GAE5F,UAAAA,GAAiB,oBAAoB,IAAC7C,EAACyB,GAAA,CAAqB,KAAK,KAAK,GACzE,EACEoB,GAAiB,KACnB5C,EAACW,EAAA,CACC,aAAYqB,GAASC,EACrB,KAAK,KACL,QAAQ,YACR,UAAU,+BACV,GAAG,IACH,KAAMd,EAAYyB,GAAiB,KAAM,GAAGtB,CAAa,IAAIC,CAAa,EAAE,EAC5E,0BAAyB,GAAGD,CAAa,IAAIC,CAAa,GAC1D,kCAAiC,GAAGS,CAAK,IAAIC,CAAQ,IAAIW,GAAiB,IAAI,GAE7E,UAAAA,GAAiB,KAClB7C,EAAC,QAAK,UAAU,UAAW,SAAAiC,GAASC,EAAS,GAC/C,EACE,KACHU,GAAiBA,EAAc,MAC9B5C,EAACY,EAAA,CACC,aAAYqB,GAASC,EACrB,KAAK,KACL,QAAQ,UACR,UAAU,6BACV,GAAG,IACH,KAAMd,EAAYwB,EAAc,KAAM,GAAGrB,CAAa,IAAIC,CAAa,EAAE,EACzE,0BAAyB,GAAGD,CAAa,IAAIC,CAAa,GAC1D,kCAAiC,GAAGS,CAAK,IAAIC,CAAQ,IAAIU,GAAe,IAAI,GAE3E,SAAAA,EAAc,KACjB,GAEJ,EACA5C,EAAC,OAAI,UAAU,iDACZ,SAAAiD,GAAW,IAAI,CAACgB,EAAMC,IACrBlE,EAAC,OAAgB,UAAU,OACzB,SAAAA,EAACc,EAAA,CACC,UAAU,uBACV,aAAa,sBACb,QAAQ,QACR,IAAKmD,GAAM,SAAS,KAAO,GAC3B,OAAQA,GAAM,SAAS,IACzB,GAPQC,CAQV,CACD,EACH,GACF,EAGCnB,EAAQ,OAAS,GAChB/C,EAAC,OAAI,UAAU,iMACZ,SAAA+C,EAAQ,IAAI,CAACoB,EAAGD,IACfjE,EAACC,EAAM,SAAN,CACC,UAAAF,EAACe,GAAA,CACC,KAAM,EACN,UAAWE,EACT,yIACF,EACA,KAAMkD,EAAE,MACV,EACCD,EAAQnB,EAAQ,OAAS,GAAK/C,EAAC,OAAI,UAAWiB,EAAG,sBAAsB,EAAG,IARxDiD,CASrB,CACD,EACH,EAIDd,GACCpD,EAACsB,GAAA,CACC,QAAS8B,EACT,SAAUP,GAAiB,UAAU,IACrC,UAAWA,GAAiB,UAC5B,aAAc,IAAMQ,EAAW,EAAK,EACtC,GAEJ,EACF,CAEJ,CAAC,EAEDxB,EAAW,YAAc,aAEzB,IAAOuC,GAAQlD,GAAWW,CAAU",
+  "names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "useState", "useEffect", "gsap", "ScrollTrigger", "useMediaQuery", "useInView", "ScrollLoadVideo", "Button", "Heading", "Picture", "Text", "Countdown", "cn", "withLayout", "useExposure", "trackUrlRef", "sizeMap", "VideoModal", "componentType", "componentName", "PlayButtonAppendIcon", "size", "width", "height", "HeroBanner", "data", "className", "ref", "title", "subtitle", "endDate", "endDate_tz", "pcImage", "padImage", "mobileImage", "pcVideo", "padVideo", "mobileVideo", "isShowVideo", "primaryButton", "secondaryButton", "theme", "caption", "blockLink", "iconArray", "isMobile", "isPad", "visible", "setVisible", "inViewRef", "inView", "scrollTriggerRef", "bgTriggerRef", "boxTriggerRef", "bgRef", "boxRef", "gsapResize", "clientHeight", "self", "value", "icon", "index", "c", "HeroBanner_default"]
 }

package/dist/esm/biz-components/HeroBanner/types.d.ts

@@ -6,6 +6,12 @@ export interface HeroBannerProps {
         title: string;
         /** 副标题/描述文本 */
         subtitle: string;
+        /** 结束时间（ISO 字符串） */
+        endDate?: string;
+        /** 结束时间时区（如: America/Los_Angeles） */
+        endDate_tz?: string;
+        /** 图标列表 */
+        iconArray?: Array<any>;
         pcImage: Media;
         padImage?: Media;
         mobileImage: Media;