@anker-in/headless-ui 1.1.87 → 1.1.89

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (412) hide show
  1. package/dist/cjs/biz-components/AccordionCards/index.d.ts +1 -1
  2. package/dist/cjs/biz-components/ActiveShelf/index.d.ts +1 -1
  3. package/dist/cjs/biz-components/ActivitySchedule/index.d.ts +1 -1
  4. package/dist/cjs/biz-components/AiuiProvider/index.d.ts +6 -0
  5. package/dist/cjs/biz-components/AiuiProvider/index.js +1 -1
  6. package/dist/cjs/biz-components/AiuiProvider/index.js.map +3 -3
  7. package/dist/cjs/biz-components/AnchorNavigation/index.d.ts +1 -1
  8. package/dist/cjs/biz-components/AplusDesc/index.d.ts +1 -1
  9. package/dist/cjs/biz-components/BrandCardLink/BrandCardLink.d.ts +1 -1
  10. package/dist/cjs/biz-components/BrandEquity/BrandEquity.d.ts +1 -1
  11. package/dist/cjs/biz-components/BrandEquity/BrandEquity.js +1 -1
  12. package/dist/cjs/biz-components/BrandEquity/BrandEquity.js.map +3 -3
  13. package/dist/cjs/biz-components/BrandEquity/types.d.ts +8 -0
  14. package/dist/cjs/biz-components/BrandEquity/types.js +1 -1
  15. package/dist/cjs/biz-components/BrandEquity/types.js.map +1 -1
  16. package/dist/cjs/biz-components/Category/index.d.ts +1 -1
  17. package/dist/cjs/biz-components/CreativeModule/index.d.ts +1 -1
  18. package/dist/cjs/biz-components/DownLoad/index.d.ts +1 -1
  19. package/dist/cjs/biz-components/Evaluate/index.d.ts +1 -1
  20. package/dist/cjs/biz-components/EventSchedule/index.d.ts +1 -1
  21. package/dist/cjs/biz-components/Faq/Faq.d.ts +1 -1
  22. package/dist/cjs/biz-components/Faq/Faq.js +1 -1
  23. package/dist/cjs/biz-components/Faq/Faq.js.map +2 -2
  24. package/dist/cjs/biz-components/Faq/types.d.ts +1 -0
  25. package/dist/cjs/biz-components/Faq/types.js +1 -1
  26. package/dist/cjs/biz-components/Faq/types.js.map +1 -1
  27. package/dist/cjs/biz-components/FeatureCards/FeatureCards.d.ts +1 -1
  28. package/dist/cjs/biz-components/FeatureShowcase/FeatureShowcase.d.ts +1 -1
  29. package/dist/cjs/biz-components/FeaturedBlogPosts/index.d.ts +1 -1
  30. package/dist/cjs/biz-components/Features/index.d.ts +1 -1
  31. package/dist/cjs/biz-components/FootCharger/index.d.ts +1 -1
  32. package/dist/cjs/biz-components/FooterNavigation/index.d.ts +1 -1
  33. package/dist/cjs/biz-components/GiftBox/index.d.ts +1 -1
  34. package/dist/cjs/biz-components/GiftShelf/index.d.ts +1 -1
  35. package/dist/cjs/biz-components/GiftTierShelf/index.d.ts +1 -1
  36. package/dist/cjs/biz-components/Graphic/index.d.ts +1 -1
  37. package/dist/cjs/biz-components/GraphicAttractionBlock/index.d.ts +1 -1
  38. package/dist/cjs/biz-components/GraphicMore/index.d.ts +1 -1
  39. package/dist/cjs/biz-components/GraphicOverlay/GraphicOverlay.d.ts +1 -1
  40. package/dist/cjs/biz-components/HeaderNavigation/index.d.ts +1 -1
  41. package/dist/cjs/biz-components/HeroBanner/HeroBanner.d.ts +21 -1
  42. package/dist/cjs/biz-components/HeroBanner/HeroBanner.js +1 -1
  43. package/dist/cjs/biz-components/HeroBanner/HeroBanner.js.map +3 -3
  44. package/dist/cjs/biz-components/HeroBanner/HeroBannerCarousel.d.ts +23 -0
  45. package/dist/cjs/biz-components/HeroBanner/HeroBannerCarousel.js +2 -0
  46. package/dist/cjs/biz-components/HeroBanner/HeroBannerCarousel.js.map +7 -0
  47. package/dist/cjs/biz-components/HeroBanner/index.d.ts +1 -0
  48. package/dist/cjs/biz-components/HeroBanner/index.js +1 -1
  49. package/dist/cjs/biz-components/HeroBanner/index.js.map +1 -1
  50. package/dist/cjs/biz-components/HeroBanner/types.d.ts +73 -0
  51. package/dist/cjs/biz-components/HeroBanner/types.js +1 -1
  52. package/dist/cjs/biz-components/HeroBanner/types.js.map +1 -1
  53. package/dist/cjs/biz-components/ImageOverlayShelf/index.d.ts +2 -2
  54. package/dist/cjs/biz-components/ImageOverlayShelf/index.js +1 -1
  55. package/dist/cjs/biz-components/ImageOverlayShelf/index.js.map +3 -3
  56. package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.d.ts +1 -1
  57. package/dist/cjs/biz-components/ImageTextOverlay/index.d.ts +9 -0
  58. package/dist/cjs/biz-components/ImageTextOverlay/index.js +18 -0
  59. package/dist/cjs/biz-components/ImageTextOverlay/index.js.map +7 -0
  60. package/dist/cjs/biz-components/ImageTextOverlay/types.d.ts +58 -0
  61. package/dist/cjs/biz-components/ImageTextOverlay/types.js +2 -0
  62. package/dist/cjs/biz-components/ImageTextOverlay/types.js.map +7 -0
  63. package/dist/cjs/biz-components/ImageWithText/ImageWithText.d.ts +1 -1
  64. package/dist/cjs/biz-components/ImageWithText/ImageWithText.js +1 -1
  65. package/dist/cjs/biz-components/ImageWithText/ImageWithText.js.map +2 -2
  66. package/dist/cjs/biz-components/Ksp/index.d.ts +1 -1
  67. package/dist/cjs/biz-components/Listing/components/PaidShipping/index.d.ts +1 -1
  68. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.d.ts +1 -1
  69. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.d.ts +1 -1
  70. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.d.ts +1 -1
  71. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.d.ts +1 -1
  72. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.d.ts +1 -1
  73. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductOptions/index.d.ts +1 -1
  74. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.d.ts +1 -1
  75. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductPaidShipping/index.d.ts +1 -1
  76. package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.d.ts +1 -1
  77. package/dist/cjs/biz-components/Listing/components/PurchaseBar/index.d.ts +1 -1
  78. package/dist/cjs/biz-components/LotteryShared/BaseModal.js +1 -1
  79. package/dist/cjs/biz-components/LotteryShared/BaseModal.js.map +2 -2
  80. package/dist/cjs/biz-components/LotteryShared/ChanceMethods.js +1 -1
  81. package/dist/cjs/biz-components/LotteryShared/ChanceMethods.js.map +3 -3
  82. package/dist/cjs/biz-components/LotteryShared/ErrorModal.js +1 -1
  83. package/dist/cjs/biz-components/LotteryShared/ErrorModal.js.map +2 -2
  84. package/dist/cjs/biz-components/LotteryShared/MyRewardsModal.d.ts +33 -0
  85. package/dist/cjs/biz-components/LotteryShared/MyRewardsModal.js +1 -1
  86. package/dist/cjs/biz-components/LotteryShared/MyRewardsModal.js.map +3 -3
  87. package/dist/cjs/biz-components/LotteryShared/PrizePool.js +1 -1
  88. package/dist/cjs/biz-components/LotteryShared/PrizePool.js.map +3 -3
  89. package/dist/cjs/biz-components/LotteryShared/WinnerModal.d.ts +1 -1
  90. package/dist/cjs/biz-components/LotteryShared/WinnerModal.js +1 -1
  91. package/dist/cjs/biz-components/LotteryShared/WinnerModal.js.map +3 -3
  92. package/dist/cjs/biz-components/LotteryShared/types.d.ts +101 -0
  93. package/dist/cjs/biz-components/LotteryShared/types.js +1 -1
  94. package/dist/cjs/biz-components/LotteryShared/types.js.map +2 -2
  95. package/dist/cjs/biz-components/Marquee/Marquee.d.ts +2 -1
  96. package/dist/cjs/biz-components/Marquee/Marquee.js +1 -1
  97. package/dist/cjs/biz-components/Marquee/Marquee.js.map +3 -3
  98. package/dist/cjs/biz-components/MarqueeReview/index.d.ts +1 -1
  99. package/dist/cjs/biz-components/Media/index.d.ts +15 -3
  100. package/dist/cjs/biz-components/Media/index.js +1 -1
  101. package/dist/cjs/biz-components/Media/index.js.map +3 -3
  102. package/dist/cjs/biz-components/MediaEndorsement/index.d.ts +1 -1
  103. package/dist/cjs/biz-components/MediaEndorsement/index.js +2 -2
  104. package/dist/cjs/biz-components/MediaEndorsement/index.js.map +3 -3
  105. package/dist/cjs/biz-components/MediaPlayerBase/index.d.ts +1 -1
  106. package/dist/cjs/biz-components/MediaPlayerBase/index.js +1 -1
  107. package/dist/cjs/biz-components/MediaPlayerBase/index.js.map +3 -3
  108. package/dist/cjs/biz-components/MediaPlayerBase/types.d.ts +26 -0
  109. package/dist/cjs/biz-components/MediaPlayerBase/types.js +1 -1
  110. package/dist/cjs/biz-components/MediaPlayerBase/types.js.map +1 -1
  111. package/dist/cjs/biz-components/MediaPlayerMulti/index.d.ts +1 -1
  112. package/dist/cjs/biz-components/MediaPlayerSticky/index.d.ts +1 -1
  113. package/dist/cjs/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.d.ts +1 -1
  114. package/dist/cjs/biz-components/MediaSceneSwitcherV2/index.d.ts +1 -1
  115. package/dist/cjs/biz-components/MediaShelf/index.d.ts +1 -1
  116. package/dist/cjs/biz-components/MemberEquity/index.d.ts +1 -1
  117. package/dist/cjs/biz-components/MiniCart/index.js +1 -1
  118. package/dist/cjs/biz-components/MiniCart/index.js.map +2 -2
  119. package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.d.ts +1 -1
  120. package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
  121. package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +2 -2
  122. package/dist/cjs/biz-components/NavigationSearch/index.d.ts +1 -1
  123. package/dist/cjs/biz-components/ProductCompare/index.d.ts +1 -1
  124. package/dist/cjs/biz-components/ProductHero/ProductHero.d.ts +1 -1
  125. package/dist/cjs/biz-components/ProductLottery/MediaDrawArea.js +1 -1
  126. package/dist/cjs/biz-components/ProductLottery/MediaDrawArea.js.map +3 -3
  127. package/dist/cjs/biz-components/ProductLottery/index.d.ts +3 -2
  128. package/dist/cjs/biz-components/ProductLottery/index.js +1 -1
  129. package/dist/cjs/biz-components/ProductLottery/index.js.map +3 -3
  130. package/dist/cjs/biz-components/ProductLottery/types.d.ts +75 -89
  131. package/dist/cjs/biz-components/ProductLottery/types.js +1 -1
  132. package/dist/cjs/biz-components/ProductLottery/types.js.map +2 -2
  133. package/dist/cjs/biz-components/ProductNav/ProductNav.d.ts +1 -1
  134. package/dist/cjs/biz-components/PromotionalBar/index.d.ts +3 -2
  135. package/dist/cjs/biz-components/PromotionalBar/index.js +1 -1
  136. package/dist/cjs/biz-components/PromotionalBar/index.js.map +3 -3
  137. package/dist/cjs/biz-components/SceneShelfV2/index.d.ts +113 -0
  138. package/dist/cjs/biz-components/SceneShelfV2/index.js +2 -0
  139. package/dist/cjs/biz-components/SceneShelfV2/index.js.map +7 -0
  140. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.d.ts +89 -0
  141. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.js +2 -0
  142. package/dist/cjs/biz-components/SceneShelfV3/ProductCard.js.map +7 -0
  143. package/dist/cjs/biz-components/SceneShelfV3/index.d.ts +79 -0
  144. package/dist/cjs/biz-components/SceneShelfV3/index.js +2 -0
  145. package/dist/cjs/biz-components/SceneShelfV3/index.js.map +7 -0
  146. package/dist/cjs/biz-components/SceneShelfV3/types.d.ts +19 -0
  147. package/dist/cjs/biz-components/SceneShelfV3/types.js +2 -0
  148. package/dist/cjs/biz-components/SceneShelfV3/types.js.map +7 -0
  149. package/dist/cjs/biz-components/SecondaryBanner/SecondaryBannerCarousel.d.ts +21 -0
  150. package/dist/cjs/biz-components/SecondaryBanner/SecondaryBannerCarousel.js +2 -0
  151. package/dist/cjs/biz-components/SecondaryBanner/SecondaryBannerCarousel.js.map +7 -0
  152. package/dist/cjs/biz-components/SecondaryBanner/index.d.ts +65 -1
  153. package/dist/cjs/biz-components/SecondaryBanner/index.js +1 -1
  154. package/dist/cjs/biz-components/SecondaryBanner/index.js.map +3 -3
  155. package/dist/cjs/biz-components/SelectStore/index.d.ts +1 -1
  156. package/dist/cjs/biz-components/ShelfDisplay/index.d.ts +1 -1
  157. package/dist/cjs/biz-components/Slogan/index.d.ts +1 -1
  158. package/dist/cjs/biz-components/Spacer/index.d.ts +1 -1
  159. package/dist/cjs/biz-components/Specs/index.d.ts +1 -1
  160. package/dist/cjs/biz-components/SpecsComparison/SpecsComparison.d.ts +1 -1
  161. package/dist/cjs/biz-components/TabWithImage/TabWithImage.d.ts +1 -1
  162. package/dist/cjs/biz-components/Tabs/Tabs.d.ts +1 -1
  163. package/dist/cjs/biz-components/TabsGroup/index.d.ts +1 -1
  164. package/dist/cjs/biz-components/TabsWithMedia/TabsWithMedia.d.ts +1 -1
  165. package/dist/cjs/biz-components/ThreeDCarousel/ThreeDCarousel.d.ts +1 -1
  166. package/dist/cjs/biz-components/Title/index.d.ts +1 -1
  167. package/dist/cjs/biz-components/Title/index.js +1 -1
  168. package/dist/cjs/biz-components/Title/index.js.map +3 -3
  169. package/dist/cjs/biz-components/Title/types.d.ts +53 -1
  170. package/dist/cjs/biz-components/Title/types.js +1 -1
  171. package/dist/cjs/biz-components/Title/types.js.map +1 -1
  172. package/dist/cjs/biz-components/VideoFeature/VideoFeature.d.ts +1 -1
  173. package/dist/cjs/biz-components/WheelLottery/BaseModal.js +1 -1
  174. package/dist/cjs/biz-components/WheelLottery/BaseModal.js.map +2 -2
  175. package/dist/cjs/biz-components/WheelLottery/ErrorModal.js +1 -1
  176. package/dist/cjs/biz-components/WheelLottery/ErrorModal.js.map +2 -2
  177. package/dist/cjs/biz-components/WheelLottery/MyRewardsModal.js +1 -1
  178. package/dist/cjs/biz-components/WheelLottery/MyRewardsModal.js.map +2 -2
  179. package/dist/cjs/biz-components/WheelLottery/WinnerModal.js +1 -1
  180. package/dist/cjs/biz-components/WheelLottery/WinnerModal.js.map +2 -2
  181. package/dist/cjs/biz-components/WheelLottery/index.d.ts +2 -1
  182. package/dist/cjs/biz-components/WheelLottery/index.js +1 -1
  183. package/dist/cjs/biz-components/WheelLottery/index.js.map +3 -3
  184. package/dist/cjs/biz-components/WheelLottery/types.d.ts +6 -0
  185. package/dist/cjs/biz-components/WheelLottery/types.js.map +2 -2
  186. package/dist/cjs/biz-components/WhyChoose/WhyChoose.d.ts +1 -1
  187. package/dist/cjs/biz-components/index.d.ts +7 -0
  188. package/dist/cjs/biz-components/index.js +1 -1
  189. package/dist/cjs/biz-components/index.js.map +3 -3
  190. package/dist/cjs/hooks/useExposure.d.ts +4 -3
  191. package/dist/cjs/hooks/useExposure.js +1 -1
  192. package/dist/cjs/hooks/useExposure.js.map +3 -3
  193. package/dist/cjs/hooks/useGridRowCount.d.ts +16 -0
  194. package/dist/cjs/hooks/useGridRowCount.js +2 -0
  195. package/dist/cjs/hooks/useGridRowCount.js.map +7 -0
  196. package/dist/cjs/hooks/useViewItemList.d.ts +21 -0
  197. package/dist/cjs/hooks/useViewItemList.js +2 -0
  198. package/dist/cjs/hooks/useViewItemList.js.map +7 -0
  199. package/dist/cjs/index.d.ts +1 -0
  200. package/dist/cjs/index.js +1 -1
  201. package/dist/cjs/index.js.map +3 -3
  202. package/dist/cjs/shared/Styles.js +1 -1
  203. package/dist/cjs/shared/Styles.js.map +3 -3
  204. package/dist/cjs/shared/trackUrlRef.d.ts +9 -0
  205. package/dist/cjs/shared/trackUrlRef.js +1 -1
  206. package/dist/cjs/shared/trackUrlRef.js.map +3 -3
  207. package/dist/cjs/types/props.d.ts +18 -1
  208. package/dist/cjs/types/props.js +1 -1
  209. package/dist/cjs/types/props.js.map +1 -1
  210. package/dist/esm/biz-components/AccordionCards/index.d.ts +1 -1
  211. package/dist/esm/biz-components/ActiveShelf/index.d.ts +1 -1
  212. package/dist/esm/biz-components/ActivitySchedule/index.d.ts +1 -1
  213. package/dist/esm/biz-components/AiuiProvider/index.d.ts +6 -0
  214. package/dist/esm/biz-components/AiuiProvider/index.js +1 -1
  215. package/dist/esm/biz-components/AiuiProvider/index.js.map +3 -3
  216. package/dist/esm/biz-components/AnchorNavigation/index.d.ts +1 -1
  217. package/dist/esm/biz-components/AplusDesc/index.d.ts +1 -1
  218. package/dist/esm/biz-components/BrandCardLink/BrandCardLink.d.ts +1 -1
  219. package/dist/esm/biz-components/BrandEquity/BrandEquity.d.ts +1 -1
  220. package/dist/esm/biz-components/BrandEquity/BrandEquity.js +1 -1
  221. package/dist/esm/biz-components/BrandEquity/BrandEquity.js.map +3 -3
  222. package/dist/esm/biz-components/BrandEquity/types.d.ts +8 -0
  223. package/dist/esm/biz-components/Category/index.d.ts +1 -1
  224. package/dist/esm/biz-components/CreativeModule/index.d.ts +1 -1
  225. package/dist/esm/biz-components/DownLoad/index.d.ts +1 -1
  226. package/dist/esm/biz-components/Evaluate/index.d.ts +1 -1
  227. package/dist/esm/biz-components/EventSchedule/index.d.ts +1 -1
  228. package/dist/esm/biz-components/Faq/Faq.d.ts +1 -1
  229. package/dist/esm/biz-components/Faq/Faq.js +1 -1
  230. package/dist/esm/biz-components/Faq/Faq.js.map +2 -2
  231. package/dist/esm/biz-components/Faq/types.d.ts +1 -0
  232. package/dist/esm/biz-components/FeatureCards/FeatureCards.d.ts +1 -1
  233. package/dist/esm/biz-components/FeatureShowcase/FeatureShowcase.d.ts +1 -1
  234. package/dist/esm/biz-components/FeaturedBlogPosts/index.d.ts +1 -1
  235. package/dist/esm/biz-components/Features/index.d.ts +1 -1
  236. package/dist/esm/biz-components/FootCharger/index.d.ts +1 -1
  237. package/dist/esm/biz-components/FooterNavigation/index.d.ts +1 -1
  238. package/dist/esm/biz-components/GiftBox/index.d.ts +1 -1
  239. package/dist/esm/biz-components/GiftShelf/index.d.ts +1 -1
  240. package/dist/esm/biz-components/GiftTierShelf/index.d.ts +1 -1
  241. package/dist/esm/biz-components/Graphic/index.d.ts +1 -1
  242. package/dist/esm/biz-components/GraphicAttractionBlock/index.d.ts +1 -1
  243. package/dist/esm/biz-components/GraphicMore/index.d.ts +1 -1
  244. package/dist/esm/biz-components/GraphicOverlay/GraphicOverlay.d.ts +1 -1
  245. package/dist/esm/biz-components/HeaderNavigation/index.d.ts +1 -1
  246. package/dist/esm/biz-components/HeroBanner/HeroBanner.d.ts +21 -1
  247. package/dist/esm/biz-components/HeroBanner/HeroBanner.js +1 -1
  248. package/dist/esm/biz-components/HeroBanner/HeroBanner.js.map +3 -3
  249. package/dist/esm/biz-components/HeroBanner/HeroBannerCarousel.d.ts +23 -0
  250. package/dist/esm/biz-components/HeroBanner/HeroBannerCarousel.js +2 -0
  251. package/dist/esm/biz-components/HeroBanner/HeroBannerCarousel.js.map +7 -0
  252. package/dist/esm/biz-components/HeroBanner/index.d.ts +1 -0
  253. package/dist/esm/biz-components/HeroBanner/index.js +1 -1
  254. package/dist/esm/biz-components/HeroBanner/index.js.map +1 -1
  255. package/dist/esm/biz-components/HeroBanner/types.d.ts +73 -0
  256. package/dist/esm/biz-components/ImageOverlayShelf/index.d.ts +2 -2
  257. package/dist/esm/biz-components/ImageOverlayShelf/index.js +1 -1
  258. package/dist/esm/biz-components/ImageOverlayShelf/index.js.map +3 -3
  259. package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.d.ts +1 -1
  260. package/dist/esm/biz-components/ImageTextOverlay/index.d.ts +9 -0
  261. package/dist/esm/biz-components/ImageTextOverlay/index.js +18 -0
  262. package/dist/esm/biz-components/ImageTextOverlay/index.js.map +7 -0
  263. package/dist/esm/biz-components/ImageTextOverlay/types.d.ts +58 -0
  264. package/dist/esm/biz-components/ImageTextOverlay/types.js +1 -0
  265. package/dist/esm/biz-components/ImageTextOverlay/types.js.map +7 -0
  266. package/dist/esm/biz-components/ImageWithText/ImageWithText.d.ts +1 -1
  267. package/dist/esm/biz-components/ImageWithText/ImageWithText.js +1 -1
  268. package/dist/esm/biz-components/ImageWithText/ImageWithText.js.map +2 -2
  269. package/dist/esm/biz-components/Ksp/index.d.ts +1 -1
  270. package/dist/esm/biz-components/Listing/components/PaidShipping/index.d.ts +1 -1
  271. package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.d.ts +1 -1
  272. package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.d.ts +1 -1
  273. package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.d.ts +1 -1
  274. package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.d.ts +1 -1
  275. package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.d.ts +1 -1
  276. package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductOptions/index.d.ts +1 -1
  277. package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.d.ts +1 -1
  278. package/dist/esm/biz-components/Listing/components/ProductCard/ProductPaidShipping/index.d.ts +1 -1
  279. package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.d.ts +1 -1
  280. package/dist/esm/biz-components/Listing/components/PurchaseBar/index.d.ts +1 -1
  281. package/dist/esm/biz-components/LotteryShared/BaseModal.js +1 -1
  282. package/dist/esm/biz-components/LotteryShared/BaseModal.js.map +2 -2
  283. package/dist/esm/biz-components/LotteryShared/ChanceMethods.js +1 -1
  284. package/dist/esm/biz-components/LotteryShared/ChanceMethods.js.map +3 -3
  285. package/dist/esm/biz-components/LotteryShared/ErrorModal.js +1 -1
  286. package/dist/esm/biz-components/LotteryShared/ErrorModal.js.map +2 -2
  287. package/dist/esm/biz-components/LotteryShared/MyRewardsModal.d.ts +33 -0
  288. package/dist/esm/biz-components/LotteryShared/MyRewardsModal.js +1 -1
  289. package/dist/esm/biz-components/LotteryShared/MyRewardsModal.js.map +3 -3
  290. package/dist/esm/biz-components/LotteryShared/PrizePool.js +1 -1
  291. package/dist/esm/biz-components/LotteryShared/PrizePool.js.map +3 -3
  292. package/dist/esm/biz-components/LotteryShared/WinnerModal.d.ts +1 -1
  293. package/dist/esm/biz-components/LotteryShared/WinnerModal.js +1 -1
  294. package/dist/esm/biz-components/LotteryShared/WinnerModal.js.map +3 -3
  295. package/dist/esm/biz-components/LotteryShared/types.d.ts +101 -0
  296. package/dist/esm/biz-components/LotteryShared/types.js +1 -1
  297. package/dist/esm/biz-components/LotteryShared/types.js.map +2 -2
  298. package/dist/esm/biz-components/Marquee/Marquee.d.ts +2 -1
  299. package/dist/esm/biz-components/Marquee/Marquee.js +1 -1
  300. package/dist/esm/biz-components/Marquee/Marquee.js.map +2 -2
  301. package/dist/esm/biz-components/MarqueeReview/index.d.ts +1 -1
  302. package/dist/esm/biz-components/Media/index.d.ts +15 -3
  303. package/dist/esm/biz-components/Media/index.js +1 -1
  304. package/dist/esm/biz-components/Media/index.js.map +3 -3
  305. package/dist/esm/biz-components/MediaEndorsement/index.d.ts +1 -1
  306. package/dist/esm/biz-components/MediaEndorsement/index.js +2 -2
  307. package/dist/esm/biz-components/MediaEndorsement/index.js.map +3 -3
  308. package/dist/esm/biz-components/MediaPlayerBase/index.d.ts +1 -1
  309. package/dist/esm/biz-components/MediaPlayerBase/index.js +1 -1
  310. package/dist/esm/biz-components/MediaPlayerBase/index.js.map +3 -3
  311. package/dist/esm/biz-components/MediaPlayerBase/types.d.ts +26 -0
  312. package/dist/esm/biz-components/MediaPlayerMulti/index.d.ts +1 -1
  313. package/dist/esm/biz-components/MediaPlayerSticky/index.d.ts +1 -1
  314. package/dist/esm/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.d.ts +1 -1
  315. package/dist/esm/biz-components/MediaSceneSwitcherV2/index.d.ts +1 -1
  316. package/dist/esm/biz-components/MediaShelf/index.d.ts +1 -1
  317. package/dist/esm/biz-components/MemberEquity/index.d.ts +1 -1
  318. package/dist/esm/biz-components/MiniCart/index.js +1 -1
  319. package/dist/esm/biz-components/MiniCart/index.js.map +2 -2
  320. package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.d.ts +1 -1
  321. package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
  322. package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +2 -2
  323. package/dist/esm/biz-components/NavigationSearch/index.d.ts +1 -1
  324. package/dist/esm/biz-components/ProductCompare/index.d.ts +1 -1
  325. package/dist/esm/biz-components/ProductHero/ProductHero.d.ts +1 -1
  326. package/dist/esm/biz-components/ProductLottery/MediaDrawArea.js +1 -1
  327. package/dist/esm/biz-components/ProductLottery/MediaDrawArea.js.map +3 -3
  328. package/dist/esm/biz-components/ProductLottery/index.d.ts +3 -2
  329. package/dist/esm/biz-components/ProductLottery/index.js +1 -1
  330. package/dist/esm/biz-components/ProductLottery/index.js.map +3 -3
  331. package/dist/esm/biz-components/ProductLottery/types.d.ts +75 -89
  332. package/dist/esm/biz-components/ProductLottery/types.js.map +2 -2
  333. package/dist/esm/biz-components/ProductNav/ProductNav.d.ts +1 -1
  334. package/dist/esm/biz-components/PromotionalBar/index.d.ts +3 -2
  335. package/dist/esm/biz-components/PromotionalBar/index.js +1 -1
  336. package/dist/esm/biz-components/PromotionalBar/index.js.map +3 -3
  337. package/dist/esm/biz-components/SceneShelfV2/index.d.ts +113 -0
  338. package/dist/esm/biz-components/SceneShelfV2/index.js +2 -0
  339. package/dist/esm/biz-components/SceneShelfV2/index.js.map +7 -0
  340. package/dist/esm/biz-components/SceneShelfV3/ProductCard.d.ts +89 -0
  341. package/dist/esm/biz-components/SceneShelfV3/ProductCard.js +2 -0
  342. package/dist/esm/biz-components/SceneShelfV3/ProductCard.js.map +7 -0
  343. package/dist/esm/biz-components/SceneShelfV3/index.d.ts +79 -0
  344. package/dist/esm/biz-components/SceneShelfV3/index.js +2 -0
  345. package/dist/esm/biz-components/SceneShelfV3/index.js.map +7 -0
  346. package/dist/esm/biz-components/SceneShelfV3/types.d.ts +19 -0
  347. package/dist/esm/biz-components/SceneShelfV3/types.js +1 -0
  348. package/dist/esm/biz-components/SceneShelfV3/types.js.map +7 -0
  349. package/dist/esm/biz-components/SecondaryBanner/SecondaryBannerCarousel.d.ts +21 -0
  350. package/dist/esm/biz-components/SecondaryBanner/SecondaryBannerCarousel.js +2 -0
  351. package/dist/esm/biz-components/SecondaryBanner/SecondaryBannerCarousel.js.map +7 -0
  352. package/dist/esm/biz-components/SecondaryBanner/index.d.ts +65 -1
  353. package/dist/esm/biz-components/SecondaryBanner/index.js +1 -1
  354. package/dist/esm/biz-components/SecondaryBanner/index.js.map +3 -3
  355. package/dist/esm/biz-components/SelectStore/index.d.ts +1 -1
  356. package/dist/esm/biz-components/ShelfDisplay/index.d.ts +1 -1
  357. package/dist/esm/biz-components/Slogan/index.d.ts +1 -1
  358. package/dist/esm/biz-components/Spacer/index.d.ts +1 -1
  359. package/dist/esm/biz-components/Specs/index.d.ts +1 -1
  360. package/dist/esm/biz-components/SpecsComparison/SpecsComparison.d.ts +1 -1
  361. package/dist/esm/biz-components/TabWithImage/TabWithImage.d.ts +1 -1
  362. package/dist/esm/biz-components/Tabs/Tabs.d.ts +1 -1
  363. package/dist/esm/biz-components/TabsGroup/index.d.ts +1 -1
  364. package/dist/esm/biz-components/TabsWithMedia/TabsWithMedia.d.ts +1 -1
  365. package/dist/esm/biz-components/ThreeDCarousel/ThreeDCarousel.d.ts +1 -1
  366. package/dist/esm/biz-components/Title/index.d.ts +1 -1
  367. package/dist/esm/biz-components/Title/index.js +1 -1
  368. package/dist/esm/biz-components/Title/index.js.map +3 -3
  369. package/dist/esm/biz-components/Title/types.d.ts +53 -1
  370. package/dist/esm/biz-components/VideoFeature/VideoFeature.d.ts +1 -1
  371. package/dist/esm/biz-components/WheelLottery/BaseModal.js +1 -1
  372. package/dist/esm/biz-components/WheelLottery/BaseModal.js.map +2 -2
  373. package/dist/esm/biz-components/WheelLottery/ErrorModal.js +1 -1
  374. package/dist/esm/biz-components/WheelLottery/ErrorModal.js.map +2 -2
  375. package/dist/esm/biz-components/WheelLottery/MyRewardsModal.js +1 -1
  376. package/dist/esm/biz-components/WheelLottery/MyRewardsModal.js.map +2 -2
  377. package/dist/esm/biz-components/WheelLottery/WinnerModal.js +1 -1
  378. package/dist/esm/biz-components/WheelLottery/WinnerModal.js.map +2 -2
  379. package/dist/esm/biz-components/WheelLottery/index.d.ts +2 -1
  380. package/dist/esm/biz-components/WheelLottery/index.js +1 -1
  381. package/dist/esm/biz-components/WheelLottery/index.js.map +3 -3
  382. package/dist/esm/biz-components/WheelLottery/types.d.ts +6 -0
  383. package/dist/esm/biz-components/WheelLottery/types.js.map +2 -2
  384. package/dist/esm/biz-components/WhyChoose/WhyChoose.d.ts +1 -1
  385. package/dist/esm/biz-components/index.d.ts +7 -0
  386. package/dist/esm/biz-components/index.js +1 -1
  387. package/dist/esm/biz-components/index.js.map +3 -3
  388. package/dist/esm/hooks/useExposure.d.ts +4 -3
  389. package/dist/esm/hooks/useExposure.js +1 -1
  390. package/dist/esm/hooks/useExposure.js.map +3 -3
  391. package/dist/esm/hooks/useGridRowCount.d.ts +16 -0
  392. package/dist/esm/hooks/useGridRowCount.js +2 -0
  393. package/dist/esm/hooks/useGridRowCount.js.map +7 -0
  394. package/dist/esm/hooks/useViewItemList.d.ts +21 -0
  395. package/dist/esm/hooks/useViewItemList.js +2 -0
  396. package/dist/esm/hooks/useViewItemList.js.map +7 -0
  397. package/dist/esm/index.d.ts +1 -0
  398. package/dist/esm/index.js +1 -1
  399. package/dist/esm/index.js.map +3 -3
  400. package/dist/esm/shared/Styles.js +1 -1
  401. package/dist/esm/shared/Styles.js.map +3 -3
  402. package/dist/esm/shared/trackUrlRef.d.ts +9 -0
  403. package/dist/esm/shared/trackUrlRef.js +1 -1
  404. package/dist/esm/shared/trackUrlRef.js.map +3 -3
  405. package/dist/esm/types/props.d.ts +18 -1
  406. package/dist/tokens/anker.css +2 -2
  407. package/dist/tokens/eufy.css +2 -2
  408. package/dist/tokens/eufyMake.css +2 -2
  409. package/dist/tokens/soundcore.css +2 -2
  410. package/package.json +1 -1
  411. package/style.css +224 -26
  412. package/tailwind.config.js +14 -2
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/HeroBanner/HeroBanner.tsx"],
4
- "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, Countdown } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { cva } from 'class-variance-authority'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getLocalizedPath } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { sizeMap } from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\n\nconst componentType = 'image'\nconst componentName = 'hero_banner'\n\n// CVA variants for align\nconst contentVariants = cva(\n 'hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]',\n {\n variants: {\n align: {\n left: 'tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]',\n center:\n 'tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n }\n)\n\nconst textVariants = cva(\n 'hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]',\n {\n variants: {\n align: {\n left: 'laptop:text-left',\n center: 'text-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n }\n)\n\nconst buttonGroupVariants = cva('hero-banner-button-group lg-desktop:gap-3 flex items-center gap-2', {\n variants: {\n align: {\n left: 'laptop:justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n})\n\nconst iconGroupVariants = cva('hero-banner-icon-group flex items-center gap-2', {\n variants: {\n align: {\n left: 'justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n})\n\nexport type HeroBannerSemanticName =\n | 'root'\n | 'title'\n | 'subtitle'\n | 'buttonGroup'\n | 'primaryButton'\n | 'secondaryButton'\n | 'captionGroup'\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<\n HTMLDivElement,\n HeroBannerProps & {\n classNames?: Partial<Record<HeroBannerSemanticName, string>>\n }\n>(({ data, className, classNames = {}, onSecondaryClick, onPrimaryClick, ...rest }, ref) => {\n const { locale } = useAiuiContext()\n\n // \u5305\u88C5\u94FE\u63A5\uFF0C\u81EA\u52A8\u6DFB\u52A0 locale \u524D\u7F00\n const localizeUrl = (url?: string) => {\n if (!url || !locale) return url\n return getLocalizedPath(url, locale)\n }\n\n const {\n label,\n title,\n subtitle,\n endDate,\n endDate_tz,\n dateFormat,\n pcImage,\n padImage,\n mobileImage,\n pcVideo,\n padVideo,\n mobileVideo,\n isShowVideo,\n isVideoLoop = true,\n primaryButton,\n secondaryButton,\n theme = 'light',\n size = 'default',\n titleSize,\n caption = [],\n blockLink,\n iconArray,\n align = 'left',\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 {...rest} ref={inViewRef} data-ui-component-id=\"HeroBanner\">\n <div\n ref={boxRef}\n className={cn(\n theme === 'dark' ? 'aiui-dark' : '',\n 'text-info-primary relative w-full overflow-hidden',\n {\n 'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]':\n size === 'default',\n 'lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]':\n size === 'sm',\n },\n className\n )}\n >\n {blockLink && (\n <a\n className=\"absolute inset-0 z-10\"\n href={trackUrlRef(localizeUrl(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={isVideoLoop}\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={contentVariants({ align })}>\n <div className={textVariants({ align })}>\n {label && (\n <Text\n size={2}\n as=\"p\"\n className={cn('hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm')}\n html={label}\n />\n )}\n {title && (\n <Heading\n as={titleSize === '4' ? 'h1' : 'h2'}\n html={title}\n className={cn('hero-banner-title', classNames.title)}\n size={titleSize ? (Number(titleSize || '5') as any) : size === 'sm' ? 4 : 5}\n />\n )}\n {subtitle && (\n <Text\n as=\"p\"\n size={2}\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\n endDate={endDate}\n endDate_tz={endDate_tz}\n dateFormat={dateFormat}\n variant=\"spacious\"\n align={align}\n />\n </div>\n )}\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className={buttonGroupVariants({ align })}>\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={secondaryButton?.isCustomSecondaryButton ? 'button' : 'a'}\n href={trackUrlRef(localizeUrl(secondaryButton?.link), `${componentType}_${componentName}`)}\n onClick={e =>\n secondaryButton?.isCustomSecondaryButton &&\n onSecondaryClick?.(data, e, secondaryButton?.customSecondaryEventId)\n }\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={primaryButton?.isCustomPrimaryButton ? 'button' : 'a'}\n href={trackUrlRef(localizeUrl(primaryButton.link), `${componentType}_${componentName}`)}\n onClick={e =>\n primaryButton?.isCustomPrimaryButton && onPrimaryClick?.(data, e, primaryButton?.customPrimaryEventId)\n }\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={iconGroupVariants({ align })}>\n {iconArray?.map(icon => (\n <div key={icon?.pcImage?.url || icon?.pcImage?.alt} 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\n className={cn(\n '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 classNames.captionGroup\n )}\n >\n {caption.map((c, index) => (\n <React.Fragment key={c.title}>\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?.isYoutubeVideo ? undefined : secondaryButton?.videoUrl?.url}\n youTubeId={secondaryButton?.isYoutubeVideo ? secondaryButton?.youtubeId : undefined}\n onCloseModal={() => setVisible(false)}\n />\n )}\n </div>\n </div>\n )\n})\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withLayout(HeroBanner)\n"],
5
- "mappings": "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",
6
- "names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "useState", "useEffect", "gsap", "ScrollTrigger", "useMediaQuery", "useInView", "ScrollLoadVideo", "Button", "Heading", "Picture", "Text", "Countdown", "cn", "cva", "withLayout", "useExposure", "trackUrlRef", "getLocalizedPath", "useAiuiContext", "sizeMap", "VideoModal", "componentType", "componentName", "contentVariants", "textVariants", "buttonGroupVariants", "iconGroupVariants", "PlayButtonAppendIcon", "size", "width", "height", "HeroBanner", "data", "className", "classNames", "onSecondaryClick", "onPrimaryClick", "rest", "ref", "locale", "localizeUrl", "url", "label", "title", "subtitle", "endDate", "endDate_tz", "dateFormat", "pcImage", "padImage", "mobileImage", "pcVideo", "padVideo", "mobileVideo", "isShowVideo", "isVideoLoop", "primaryButton", "secondaryButton", "theme", "titleSize", "caption", "blockLink", "iconArray", "align", "isMobile", "isPad", "visible", "setVisible", "inViewRef", "inView", "scrollTriggerRef", "bgTriggerRef", "boxTriggerRef", "bgRef", "boxRef", "gsapResize", "clientHeight", "self", "value", "e", "icon", "c", "index", "HeroBanner_default"]
4
+ "sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef, useState, useEffect } from 'react'\nimport gsap from 'gsap'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport jump from 'jump.js'\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, Countdown } from '../../components/index.js'\nimport { cn } from '../../helpers/index.js'\nimport { cva } from 'class-variance-authority'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { getLocalizedPath } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { sizeMap } from '../../components/button.js'\nimport { VideoModal } from '../VideoModal/index.js'\n// Task 18: import carousel implementation for early-return delegation (DECISION-A002)\nimport HeroBannerCarousel from './HeroBannerCarousel.js'\n\n/**\n * jump.js \u914D\u7F6E\u9009\u9879\n */\nexport interface JumpOptions {\n /** \u52A8\u753B\u6301\u7EED\u65F6\u95F4\uFF08\u6BEB\u79D2\uFF09 @default 500 */\n duration?: number\n /** \u504F\u79FB\u91CF\uFF08\u50CF\u7D20\uFF09 @default 0 */\n offset?: number\n /** \u52A8\u753B\u5B8C\u6210\u56DE\u8C03 */\n callback?: () => void\n /** \u7F13\u52A8\u51FD\u6570 */\n easing?: (t: number, b: number, c: number, d: number) => number\n /** \u662F\u5426\u8003\u8651 a11y @default false */\n a11y?: boolean\n}\n\nconst componentType = 'image'\nconst componentName = 'hero_banner'\n\n// CVA variants for align\nconst contentVariants = cva(\n 'hero-banner-content lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]',\n {\n variants: {\n align: {\n left: 'tablet:px-[32px] laptop:top-1/2 laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] laptop:-translate-y-1/2 left-0 px-[16px]',\n center:\n 'tablet:top-[84px] laptop:top-[76px] desktop:top-[176px] lg-desktop:top-[192px] left-1/2 top-[84px] -translate-x-1/2 translate-y-0 items-center text-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n }\n)\n\nconst textVariants = cva(\n 'hero-banner-wrap-text lg-desktop:max-w-[824px] desktop:max-w-[648px] laptop:max-w-[440px] tablet:max-w-[704px] max-w-[358px]',\n {\n variants: {\n align: {\n left: 'laptop:text-left',\n center: 'text-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n }\n)\n\nconst buttonGroupVariants = cva('hero-banner-button-group lg-desktop:gap-3 flex items-center gap-2', {\n variants: {\n align: {\n left: 'laptop:justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n})\n\nconst iconGroupVariants = cva('hero-banner-icon-group flex items-center gap-2', {\n variants: {\n align: {\n left: 'justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n align: 'left',\n },\n})\n\nexport type HeroBannerSemanticName =\n | 'root'\n | 'title'\n | 'subtitle'\n | 'buttonGroup'\n | 'primaryButton'\n | 'secondaryButton'\n | 'captionGroup'\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<\n HTMLDivElement,\n HeroBannerProps & {\n classNames?: Partial<Record<HeroBannerSemanticName, string>>\n /**\n * \u951A\u70B9\u8DF3\u8F6C\u914D\u7F6E\uFF08\u7528\u4E8E # \u5F00\u5934\u7684\u94FE\u63A5\uFF09\n * @default { duration: 500, offset: 0 }\n */\n jumpOptions?: JumpOptions\n }\n>(({ data, className, classNames = {}, onSecondaryClick, onPrimaryClick, jumpOptions = {}, ...rest }, ref) => {\n const { locale } = useAiuiContext()\n\n // \u9ED8\u8BA4 jump \u914D\u7F6E\n const defaultJumpOptions: JumpOptions = { duration: 500, offset: 0 }\n const mergedJumpOptions = { ...defaultJumpOptions, ...jumpOptions }\n\n // \u5305\u88C5\u94FE\u63A5\uFF0C\u81EA\u52A8\u6DFB\u52A0 locale \u524D\u7F00\n const localizeUrl = (url?: string) => {\n if (!url || !locale) return url\n return getLocalizedPath(url, locale)\n }\n\n const {\n label,\n title,\n subtitle,\n endDate,\n endDate_tz,\n dateFormat,\n pcImage,\n padImage,\n mobileImage,\n pcVideo,\n padVideo,\n mobileVideo,\n isShowVideo,\n isVideoLoop = true,\n primaryButton,\n secondaryButton,\n theme = 'light',\n size = 'default',\n titleSize,\n caption = [],\n blockLink,\n iconArray,\n align = 'left',\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 // Task 7: Compute accessibility / tracking fallback values (Rule 2/3/4 \u2014 DECISION-T3)\n // blockLink aria-label: title \u2192 subtitle \u2192 pcImage.alt \u2192 undefined (absent attr)\n const blockLinkLabel = title?.trim() || subtitle?.trim() || pcImage?.alt?.trim() || undefined\n // componentTitle: title=undefined \u2192 coerce '' via subtitle only (no pcImage.alt for undefined title);\n // title='' (intentional) \u2192 cascade: subtitle \u2192 pcImage.alt \u2192 undefined\n const resolvedComponentTitle =\n title !== undefined\n ? title?.trim() || subtitle?.trim() || pcImage?.alt?.trim() || undefined\n : (subtitle && subtitle.trim()) || ''\n // componentDescription: subtitle with undefined guard\n const resolvedComponentDescription = (subtitle && subtitle.trim()) || ''\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: resolvedComponentTitle,\n componentDescription: resolvedComponentDescription,\n })\n\n useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n useEffect(() => {\n // Task 18: GSAP bypass \u2014 skip ALL GSAP setup in carousel mode (DECISION-A002/DECISION-009)\n if (data.items && data.items.length > 0) return\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, data.items])\n\n // Task 18: Carousel mode early return (DECISION-A002 / DECISION-011)\n // All hooks above have already run. Delegate entirely to HeroBannerCarousel\n // when data.items is non-empty; GSAP was already bypassed in the useEffect above.\n if (data.items && data.items.length > 0) {\n return (\n <HeroBannerCarousel\n data={data}\n className={className}\n classNames={classNames}\n onPrimaryClick={onPrimaryClick}\n onSecondaryClick={onSecondaryClick}\n ref={ref as React.Ref<HTMLDivElement>}\n {...rest}\n />\n )\n }\n return (\n <div {...rest} ref={inViewRef} data-ui-component-id=\"HeroBanner\">\n <div\n ref={boxRef}\n className={cn(\n theme === 'dark' ? 'aiui-dark' : '',\n 'text-info-primary relative w-full overflow-hidden',\n {\n 'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]':\n size === 'default',\n 'lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]':\n size === 'sm',\n },\n className\n )}\n >\n {blockLink && (\n <a\n className=\"absolute inset-0 z-10\"\n href={trackUrlRef(localizeUrl(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={blockLinkLabel}\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={isVideoLoop}\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={contentVariants({ align })}>\n <div className={textVariants({ align })}>\n {label && (\n <Text\n size={2}\n as=\"p\"\n className={cn('hero-banner-label font-heading lg-desktop:text-[18px] desktop:text-base text-sm')}\n html={label}\n />\n )}\n {title && (\n <Heading\n as={titleSize === '4' ? 'h1' : 'h2'}\n html={title}\n className={cn('hero-banner-title', classNames.title)}\n size={titleSize ? (Number(titleSize || '5') as any) : size === 'sm' ? 4 : 5}\n />\n )}\n {subtitle && (\n <Text\n as=\"p\"\n size={2}\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\n endDate={endDate}\n endDate_tz={endDate_tz}\n dateFormat={dateFormat}\n variant=\"spacious\"\n align={align}\n />\n </div>\n )}\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div className={buttonGroupVariants({ align })}>\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={secondaryButton?.isCustomSecondaryButton ? 'button' : 'a'}\n href={trackUrlRef(localizeUrl(secondaryButton?.link), `${componentType}_${componentName}`)}\n onClick={e => {\n if (secondaryButton.link?.startsWith('#')) {\n e.preventDefault()\n const element = document.querySelector(secondaryButton.link)\n if (element) {\n jump(element as HTMLElement, mergedJumpOptions)\n }\n }\n secondaryButton?.isCustomSecondaryButton &&\n onSecondaryClick?.(data, e, secondaryButton?.customSecondaryEventId)\n }}\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={primaryButton?.isCustomPrimaryButton ? 'button' : 'a'}\n href={trackUrlRef(localizeUrl(primaryButton.link), `${componentType}_${componentName}`)}\n onClick={e => {\n if (primaryButton.link?.startsWith('#')) {\n e.preventDefault()\n const element = document.querySelector(primaryButton.link)\n if (element) {\n jump(element as HTMLElement, mergedJumpOptions)\n }\n }\n primaryButton?.isCustomPrimaryButton && onPrimaryClick?.(data, e, primaryButton?.customPrimaryEventId)\n }}\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={iconGroupVariants({ align })}>\n {iconArray?.map(icon => (\n <div key={icon?.pcImage?.url || icon?.pcImage?.alt} 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\n className={cn(\n '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 classNames.captionGroup\n )}\n >\n {caption.map((c, index) => (\n <React.Fragment key={c.title}>\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?.isYoutubeVideo ? undefined : secondaryButton?.videoUrl?.url}\n youTubeId={secondaryButton?.isYoutubeVideo ? secondaryButton?.youtubeId : undefined}\n onCloseModal={() => setVisible(false)}\n />\n )}\n </div>\n </div>\n )\n})\n\nHeroBanner.displayName = 'HeroBanner'\n\nexport default withLayout(HeroBanner)\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "React", "useImperativeHandle", "useRef", "useState", "useEffect", "gsap", "ScrollTrigger", "jump", "useMediaQuery", "useInView", "ScrollLoadVideo", "Button", "Heading", "Picture", "Text", "Countdown", "cn", "cva", "withLayout", "useExposure", "trackUrlRef", "getLocalizedPath", "useAiuiContext", "sizeMap", "VideoModal", "HeroBannerCarousel", "componentType", "componentName", "contentVariants", "textVariants", "buttonGroupVariants", "iconGroupVariants", "PlayButtonAppendIcon", "size", "width", "height", "HeroBanner", "data", "className", "classNames", "onSecondaryClick", "onPrimaryClick", "jumpOptions", "rest", "ref", "locale", "mergedJumpOptions", "localizeUrl", "url", "label", "title", "subtitle", "endDate", "endDate_tz", "dateFormat", "pcImage", "padImage", "mobileImage", "pcVideo", "padVideo", "mobileVideo", "isShowVideo", "isVideoLoop", "primaryButton", "secondaryButton", "theme", "titleSize", "caption", "blockLink", "iconArray", "align", "isMobile", "isPad", "visible", "setVisible", "inViewRef", "inView", "scrollTriggerRef", "bgTriggerRef", "boxTriggerRef", "bgRef", "boxRef", "blockLinkLabel", "resolvedComponentTitle", "resolvedComponentDescription", "gsapResize", "clientHeight", "self", "value", "e", "element", "icon", "c", "index", "HeroBanner_default"]
7
7
  }
@@ -0,0 +1,23 @@
1
+ import React from 'react';
2
+ import type { HeroBannerProps } from './types.js';
3
+ import 'swiper/css';
4
+ import 'swiper/css/navigation';
5
+ import 'swiper/css/pagination';
6
+ interface HeroBannerCarouselProps extends React.HTMLAttributes<HTMLDivElement> {
7
+ data: HeroBannerProps['data'];
8
+ classNames?: Record<string, string>;
9
+ onPrimaryClick?: (data: any, e: any, id?: string) => void;
10
+ onSecondaryClick?: (data: any, e: any, id?: string) => void;
11
+ }
12
+ /**
13
+ * HeroBannerCarousel — arrows-only Navigation Swiper wrapping HeroBannerSlide units.
14
+ *
15
+ * Architecture:
16
+ * - DECISION-A007: Navigation only, loop=false, slidesPerView=1
17
+ * - DECISION-A003: ScrollLoadVideo videoRef as imperative pause channel
18
+ * - DECISION-A010: initial activeIndex=0; useEffect pauses slides 1..N on mount
19
+ * - DECISION-A006: arrow buttons at z-[20], above blockLink overlay z-10
20
+ * - ISSUE-017: post-mount pause wins over IO rootMargin='200px' race
21
+ */
22
+ declare const HeroBannerCarousel: React.ForwardRefExoticComponent<HeroBannerCarouselProps & React.RefAttributes<HTMLDivElement>>;
23
+ export default HeroBannerCarousel;
@@ -0,0 +1,2 @@
1
+ "use client";import{jsx as e,jsxs as i}from"react/jsx-runtime";import N,{useRef as H,useEffect as R,useCallback as j,useState as A}from"react";import{Swiper as E,SwiperSlide as I}from"swiper/react";import{Navigation as L,Pagination as P,Autoplay as M}from"swiper/modules";import V from"../../helpers/ScrollLoadVideo.js";import{cn as b}from"../../helpers/index.js";import{Button as _,Heading as D,Text as O}from"../../components/index.js";import"swiper/css";import"swiper/css/navigation";import"swiper/css/pagination";const W=()=>i("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[e("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M23 13L16 20L23 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),F=()=>i("svg",{width:"40",height:"40",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:[e("circle",{cx:"20",cy:"20",r:"20",fill:"currentColor",fillOpacity:"0.2"}),e("path",{d:"M17 13L24 20L17 27",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),U=({data:l,isActive:S,videoRef:C,onPrimaryClick:v,onSecondaryClick:w})=>{const{pcVideo:h,padVideo:k,mobileVideo:p,pcImage:c,mobileImage:d,isVideoLoop:B=!0,title:g,subtitle:s,primaryButton:o,secondaryButton:a,theme:u="light",align:m="left",titleSize:f,size:x="default"}=l,t=h?.url||k?.url||p?.url||"",n=c?.url||d?.url||"";return i("div",{className:b("text-info-primary relative w-full overflow-hidden",u==="dark"?"aiui-dark":"",x==="default"?"lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]":"lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]"),children:[e(V,{videoRef:C,src:t,poster:n,className:"absolute inset-0 size-full",videoClassName:"size-full object-cover",muted:!0,loop:B,playsInline:!0}),i("div",{className:b("laptop:top-1/2 laptop:-translate-y-1/2 lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]",m==="center"?"left-1/2 -translate-x-1/2 items-center text-center":"tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] left-0 px-[16px]"),children:[i("div",{className:b("tablet:max-w-[704px] laptop:max-w-[440px] desktop:max-w-[648px] lg-desktop:max-w-[824px] max-w-[358px]",m==="center"?"text-center":"laptop:text-left"),children:[g&&e(D,{as:f==="4"?"h1":"h2",html:g,size:f?Number(f||"5"):x==="sm"?4:5}),s&&e(O,{as:"p",size:2,className:"font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm",html:s})]}),(o?.text||a?.text)&&i("div",{className:b("lg-desktop:gap-3 flex items-center gap-2",m==="center"?"justify-center":"laptop:justify-start"),children:[a?.text&&e(_,{size:"lg",variant:"secondary",as:a?.isCustomSecondaryButton?"button":"a",href:a.link,onClick:r=>a?.isCustomSecondaryButton&&w?.(l,r,a?.customSecondaryEventId),children:a.text}),o?.text&&e(_,{size:"lg",variant:"primary",as:o?.isCustomPrimaryButton?"button":"a",href:o.link,onClick:r=>o?.isCustomPrimaryButton&&v?.(l,r,o?.customPrimaryEventId),children:o.text})]})]})]})},T=N.forwardRef(({data:l,className:S,classNames:C={},onPrimaryClick:v,onSecondaryClick:w,...h},k)=>{const p=l.items||[],c=l.carousel,d=H(null),[B,g]=A(0),s=H(p.map(()=>N.createRef())),o=(c?.showArrows??!0)&&p.length>1,a=c?.showDots??!0,u=c?.autoplaySeconds,m=u!==void 0?[L,P,M]:[L,P],f=u!==void 0?{delay:u*1e3,disableOnInteraction:!1}:!1;R(()=>{s.current.forEach((t,n)=>{n!==0&&t.current&&(t.current.pause(),t.current.currentTime=0)})},[]);const x=j(t=>{const n=t.realIndex;s.current.forEach((y,z)=>{z!==n&&y.current&&(y.current.pause(),y.current.currentTime=0)});const r=s.current[n];r?.current&&r.current.paused&&r.current.play()?.catch(()=>{}),g(n)},[]);return i("div",{ref:k,className:b("hero-banner-carousel relative w-full overflow-hidden",S),...h,children:[e(E,{onSwiper:t=>d.current=t,onSlideChange:x,modules:m,slidesPerView:1,loop:c?.loop??!0,initialSlide:0,allowTouchMove:!0,autoplay:f,pagination:a?{clickable:!0,el:".hero-banner-pagination",renderBullet:(t,n)=>`<span class="${n} banner-dot"></span>`}:!1,children:p.map((t,n)=>e(I,{children:({isActive:r})=>e(U,{data:t,isActive:r,videoRef:s.current[n],onPrimaryClick:v,onSecondaryClick:w})},n))}),o&&i("div",{className:"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4",children:[e("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>d.current?.slidePrev(),"aria-label":"Previous banner",children:e(W,{})}),e("button",{type:"button",className:"tablet:flex pointer-events-auto hidden items-center justify-center",onClick:()=>d.current?.slideNext(),"aria-label":"Next banner",children:e(F,{})})]}),a&&e("div",{className:"hero-banner-pagination swiper-pagination tablet:bottom-6 absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot.swiper-pagination-bullet-active]:bg-[#080A0F] [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100"})]})});T.displayName="HeroBannerCarousel";var ee=T;export{ee as default};
2
+ //# sourceMappingURL=HeroBannerCarousel.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/HeroBanner/HeroBannerCarousel.tsx"],
4
+ "sourcesContent": ["'use client'\nimport React, { useRef, useEffect, useCallback, useState } from 'react'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Navigation, Pagination, Autoplay } from 'swiper/modules'\nimport type { Swiper as SwiperType } from 'swiper'\nimport ScrollLoadVideo from '../../helpers/ScrollLoadVideo.js'\nimport { cn } from '../../helpers/index.js'\nimport type { HeroBannerProps, HeroBannerSlideData } from './types.js'\nimport { Button, Heading, Text } from '../../components/index.js'\n\nimport 'swiper/css'\nimport 'swiper/css/navigation'\nimport 'swiper/css/pagination'\n\n// \u2500\u2500 Arrow icons \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\nconst ChevronLeft = () => (\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n <path d=\"M23 13L16 20L23 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n)\n\nconst ChevronRight = () => (\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n <circle cx=\"20\" cy=\"20\" r=\"20\" fill=\"currentColor\" fillOpacity=\"0.2\" />\n <path d=\"M17 13L24 20L17 27\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n)\n\n// \u2500\u2500 HeroBannerSlide \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n// Minimal per-slide content unit. No GSAP, no withLayout, no useExposure.\n// videoRef is the imperative pause/play channel (DECISION-A003).\n\ninterface HeroBannerSlideProps {\n data: HeroBannerSlideData\n isActive: boolean\n videoRef: React.RefObject<HTMLVideoElement>\n onPrimaryClick?: (data: any, e: any, id?: string) => void\n onSecondaryClick?: (data: any, e: any, id?: string) => void\n}\n\nconst HeroBannerSlide = ({\n data,\n isActive: _isActive,\n videoRef,\n onPrimaryClick,\n onSecondaryClick,\n}: HeroBannerSlideProps) => {\n const {\n pcVideo,\n padVideo,\n mobileVideo,\n pcImage,\n mobileImage,\n isVideoLoop = true,\n title,\n subtitle,\n primaryButton,\n secondaryButton,\n theme = 'light',\n align = 'left',\n titleSize,\n size = 'default',\n } = data\n\n // Resolve video src (pc preferred; fallback to mobile)\n const videoSrc = pcVideo?.url || padVideo?.url || mobileVideo?.url || ''\n // Poster from image (shown while video loads or for image-only slides)\n const posterUrl = pcImage?.url || mobileImage?.url || ''\n\n return (\n <div\n className={cn(\n 'text-info-primary relative w-full overflow-hidden',\n theme === 'dark' ? 'aiui-dark' : '',\n size === 'default'\n ? 'lg-desktop:aspect-[1920/930] desktop:aspect-[1440/700] laptop:aspect-[1024/520] tablet:aspect-[768/660] aspect-[390/660]'\n : 'lg-desktop:aspect-[1920/800] desktop:aspect-[1440/640] laptop:aspect-[1024/480] tablet:aspect-[768/560] aspect-[390/560]'\n )}\n >\n {/* Background media \u2014 always ScrollLoadVideo so videoRef is always attached.\n For image-only slides src='', IO won't load a video, but ref is live for control. */}\n <ScrollLoadVideo\n videoRef={videoRef}\n src={videoSrc}\n poster={posterUrl}\n className=\"absolute inset-0 size-full\"\n videoClassName=\"size-full object-cover\"\n muted\n loop={isVideoLoop}\n playsInline\n />\n\n {/* Content Overlay */}\n <div\n className={cn(\n 'laptop:top-1/2 laptop:-translate-y-1/2 lg-desktop:gap-[32px] absolute top-24 z-10 flex w-full flex-col gap-[24px]',\n align === 'center'\n ? 'left-1/2 -translate-x-1/2 items-center text-center'\n : 'tablet:px-[32px] laptop:px-[64px] lg-desktop:px-[calc(50%-832px)] left-0 px-[16px]'\n )}\n >\n <div\n className={cn(\n 'tablet:max-w-[704px] laptop:max-w-[440px] desktop:max-w-[648px] lg-desktop:max-w-[824px] max-w-[358px]',\n align === 'center' ? 'text-center' : 'laptop:text-left'\n )}\n >\n {title && (\n <Heading\n as={titleSize === '4' ? 'h1' : 'h2'}\n html={title}\n size={titleSize ? (Number(titleSize || '5') as any) : size === 'sm' ? 4 : 5}\n />\n )}\n {subtitle && (\n <Text\n as=\"p\"\n size={2}\n className=\"font-heading lg-desktop:text-[18px] desktop:text-base laptop:mt-2 lg-desktop:mt-4 mt-1 text-sm\"\n html={subtitle}\n />\n )}\n </div>\n\n {(primaryButton?.text || secondaryButton?.text) && (\n <div\n className={cn(\n 'lg-desktop:gap-3 flex items-center gap-2',\n align === 'center' ? 'justify-center' : 'laptop:justify-start'\n )}\n >\n {secondaryButton?.text && (\n <Button\n size=\"lg\"\n variant=\"secondary\"\n as={secondaryButton?.isCustomSecondaryButton ? 'button' : 'a'}\n href={secondaryButton.link}\n onClick={e =>\n secondaryButton?.isCustomSecondaryButton &&\n onSecondaryClick?.(data, e, secondaryButton?.customSecondaryEventId)\n }\n >\n {secondaryButton.text}\n </Button>\n )}\n {primaryButton?.text && (\n <Button\n size=\"lg\"\n variant=\"primary\"\n as={primaryButton?.isCustomPrimaryButton ? 'button' : 'a'}\n href={primaryButton.link}\n onClick={e =>\n primaryButton?.isCustomPrimaryButton && onPrimaryClick?.(data, e, primaryButton?.customPrimaryEventId)\n }\n >\n {primaryButton.text}\n </Button>\n )}\n </div>\n )}\n </div>\n </div>\n )\n}\n\n// \u2500\u2500 HeroBannerCarousel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\ninterface HeroBannerCarouselProps extends React.HTMLAttributes<HTMLDivElement> {\n data: HeroBannerProps['data']\n classNames?: Record<string, string>\n onPrimaryClick?: (data: any, e: any, id?: string) => void\n onSecondaryClick?: (data: any, e: any, id?: string) => void\n}\n\n/**\n * HeroBannerCarousel \u2014 arrows-only Navigation Swiper wrapping HeroBannerSlide units.\n *\n * Architecture:\n * - DECISION-A007: Navigation only, loop=false, slidesPerView=1\n * - DECISION-A003: ScrollLoadVideo videoRef as imperative pause channel\n * - DECISION-A010: initial activeIndex=0; useEffect pauses slides 1..N on mount\n * - DECISION-A006: arrow buttons at z-[20], above blockLink overlay z-10\n * - ISSUE-017: post-mount pause wins over IO rootMargin='200px' race\n */\nconst HeroBannerCarousel = React.forwardRef<HTMLDivElement, HeroBannerCarouselProps>(\n (\n {\n data,\n className,\n classNames: _classNames = {},\n onPrimaryClick: _onPrimaryClick,\n onSecondaryClick: _onSecondaryClick,\n ...rest\n },\n ref\n ) => {\n const items = data.items || []\n const carousel = data.carousel\n\n const swiperRef = useRef<SwiperType | null>(null)\n const [_activeIndex, setActiveIndex] = useState(0)\n\n // One RefObject<HTMLVideoElement> per slide.\n // Created once at mount; ref count is fixed (ISSUE-022 \u2014 stable data assumed).\n // DECISION-A003: passed to HeroBannerSlide \u2192 ScrollLoadVideo as imperative channel.\n const videoRefs = useRef<React.RefObject<HTMLVideoElement>[]>(items.map(() => React.createRef<HTMLVideoElement>()))\n\n // Arrow visibility formula \u2014 DECISION-011\n const showArrowControls = (carousel?.showArrows ?? true) && items.length > 1\n\n // Pagination dots visibility formula \u2014 DECISION-006\n const showDots = carousel?.showDots ?? true\n\n // Autoplay module configuration \u2014 DECISION-006\n const autoplaySeconds = carousel?.autoplaySeconds\n const swiperModules = autoplaySeconds !== undefined ? [Navigation, Pagination, Autoplay] : [Navigation, Pagination]\n const autoplayConfig =\n autoplaySeconds !== undefined ? { delay: autoplaySeconds * 1000, disableOnInteraction: false } : false\n\n // Post-mount effect: pause all non-active (index !== 0) slide videos.\n // Wins the race against ScrollLoadVideo's IO rootMargin='200px' auto-play (ISSUE-017).\n useEffect(() => {\n videoRefs.current.forEach((vRef, i) => {\n if (i !== 0 && vRef.current) {\n vRef.current.pause()\n vRef.current.currentTime = 0\n }\n })\n }, [])\n\n // Slide transition handler \u2014 pause outgoing, play incoming (DECISION-A003 / DECISION-009)\n const handleSlideChange = useCallback((swiper: SwiperType) => {\n const newIndex = swiper.realIndex\n // Pause and reset all non-active slide videos\n videoRefs.current.forEach((vRef, i) => {\n if (i !== newIndex && vRef.current) {\n vRef.current.pause()\n vRef.current.currentTime = 0\n }\n })\n // Play incoming slide video \u2014 guard against AbortError from rapid swipe (ISSUE-005)\n const incoming = videoRefs.current[newIndex]\n if (incoming?.current && incoming.current.paused) {\n const p = incoming.current.play()\n p?.catch(() => {}) // Absorb AbortError silently\n }\n setActiveIndex(newIndex)\n }, [])\n\n return (\n <div ref={ref} className={cn('hero-banner-carousel relative w-full overflow-hidden', className)} {...rest}>\n <Swiper\n onSwiper={s => (swiperRef.current = s)}\n onSlideChange={handleSlideChange}\n modules={swiperModules}\n slidesPerView={1}\n loop={carousel?.loop ?? true}\n initialSlide={0}\n allowTouchMove={true}\n autoplay={autoplayConfig}\n pagination={\n showDots\n ? {\n clickable: true,\n el: '.hero-banner-pagination',\n renderBullet: (_index: number, className: string) => `<span class=\"${className} banner-dot\"></span>`,\n }\n : false\n }\n >\n {items.map((slideData, index) => (\n <SwiperSlide key={index}>\n {({ isActive }) => (\n <HeroBannerSlide\n data={slideData}\n isActive={isActive}\n videoRef={videoRefs.current[index]}\n onPrimaryClick={_onPrimaryClick}\n onSecondaryClick={_onSecondaryClick}\n />\n )}\n </SwiperSlide>\n ))}\n </Swiper>\n\n {/* Arrow navigation \u2014 z-[20] to stay above blockLink overlay (z-10) \u2014 DECISION-A006 */}\n {showArrowControls && (\n <div className=\"pointer-events-none absolute inset-0 z-20 flex items-center justify-between px-4\">\n <button\n type=\"button\"\n className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n onClick={() => swiperRef.current?.slidePrev()}\n aria-label=\"Previous banner\"\n >\n <ChevronLeft />\n </button>\n <button\n type=\"button\"\n className=\"tablet:flex pointer-events-auto hidden items-center justify-center\"\n onClick={() => swiperRef.current?.slideNext()}\n aria-label=\"Next banner\"\n >\n <ChevronRight />\n </button>\n </div>\n )}\n\n {/* Pagination dots \u2014 visible on all devices */}\n {showDots && (\n <div className=\"hero-banner-pagination swiper-pagination tablet:bottom-6 absolute bottom-5 left-1/2 z-20 flex -translate-x-1/2 items-center justify-center gap-2 [&_.banner-dot.swiper-pagination-bullet-active]:h-2 [&_.banner-dot.swiper-pagination-bullet-active]:w-8 [&_.banner-dot.swiper-pagination-bullet-active]:rounded-full [&_.banner-dot.swiper-pagination-bullet-active]:bg-[#080A0F] [&_.banner-dot]:size-2 [&_.banner-dot]:rounded-full [&_.banner-dot]:bg-[#767880] [&_.banner-dot]:transition-all [&_.banner-dot]:duration-300 [&_.banner-dot]:ease-out [&_.swiper-pagination-bullet]:m-0 [&_.swiper-pagination-bullet]:shrink-0 [&_.swiper-pagination-bullet]:opacity-100\" />\n )}\n </div>\n )\n }\n)\n\nHeroBannerCarousel.displayName = 'HeroBannerCarousel'\n\nexport default HeroBannerCarousel\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "React", "useRef", "useEffect", "useCallback", "useState", "Swiper", "SwiperSlide", "Navigation", "Pagination", "Autoplay", "ScrollLoadVideo", "cn", "Button", "Heading", "Text", "ChevronLeft", "ChevronRight", "HeroBannerSlide", "data", "_isActive", "videoRef", "onPrimaryClick", "onSecondaryClick", "pcVideo", "padVideo", "mobileVideo", "pcImage", "mobileImage", "isVideoLoop", "title", "subtitle", "primaryButton", "secondaryButton", "theme", "align", "titleSize", "size", "videoSrc", "posterUrl", "e", "HeroBannerCarousel", "className", "_classNames", "_onPrimaryClick", "_onSecondaryClick", "rest", "ref", "items", "carousel", "swiperRef", "_activeIndex", "setActiveIndex", "videoRefs", "showArrowControls", "showDots", "autoplaySeconds", "swiperModules", "autoplayConfig", "vRef", "i", "handleSlideChange", "swiper", "newIndex", "incoming", "s", "_index", "slideData", "index", "isActive", "HeroBannerCarousel_default"]
7
+ }
@@ -1 +1,2 @@
1
1
  export { default } from './HeroBanner.js';
2
+ export type { JumpOptions } from './HeroBanner.js';
@@ -1,2 +1,2 @@
1
- import{default as o}from"./HeroBanner.js";export{o as default};
1
+ import{default as r}from"./HeroBanner.js";export{r as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/HeroBanner/index.tsx"],
4
- "sourcesContent": ["export { default } from './HeroBanner.js'\n"],
4
+ "sourcesContent": ["export { default } from './HeroBanner.js'\nexport type { JumpOptions } from './HeroBanner.js'\n"],
5
5
  "mappings": "AAAA,OAAS,WAAAA,MAAe",
6
6
  "names": ["default"]
7
7
  }
@@ -1,6 +1,68 @@
1
1
  import type { ButtonProps } from '../../components/button.js';
2
2
  import type { Media, Theme } from '../../types/props.js';
3
3
  type TitleSizeType = '5' | '4' | '3' | '2' | '1';
4
+ /**
5
+ * Carousel navigation configuration for HeroBanner. v1: arrows only.
6
+ * autoplay, dots, and progress are intentionally EXCLUDED from v1.
7
+ */
8
+ export interface HeroBannerCarouselConfig {
9
+ /**
10
+ * Show prev/next arrow navigation controls.
11
+ * Only used when data.items has 2+ slides.
12
+ * @default true
13
+ */
14
+ showArrows?: boolean;
15
+ showDots?: boolean;
16
+ loop?: boolean;
17
+ autoplaySeconds?: number;
18
+ }
19
+ /**
20
+ * Per-slide data for HeroBanner carousel mode.
21
+ * Mirrors the single-banner data shape; no nested carousels allowed in v1.
22
+ */
23
+ export interface HeroBannerSlideData {
24
+ title: string;
25
+ subtitle: string;
26
+ pcImage: Media;
27
+ mobileImage: Media;
28
+ label?: string;
29
+ endDate?: string;
30
+ endDate_tz?: string;
31
+ dateFormat?: string;
32
+ iconArray?: Array<any>;
33
+ padImage?: Media;
34
+ pcVideo?: Media;
35
+ padVideo?: Media;
36
+ mobileVideo?: Media;
37
+ isShowVideo?: boolean;
38
+ isVideoLoop?: boolean;
39
+ blockLink?: string;
40
+ primaryButton?: {
41
+ text: string;
42
+ link?: string;
43
+ isCustomPrimaryButton?: boolean;
44
+ customPrimaryEventId?: string;
45
+ } & Omit<ButtonProps, 'children'>;
46
+ secondaryButton?: {
47
+ text: string;
48
+ link?: string;
49
+ isShowPlayVideoButton?: boolean;
50
+ playVideoButtonText?: string;
51
+ playIcon?: boolean;
52
+ videoUrl?: Media;
53
+ youtubeId?: string;
54
+ isYoutubeVideo?: boolean;
55
+ isCustomSecondaryButton?: boolean;
56
+ customSecondaryEventId?: string;
57
+ } & Omit<ButtonProps, 'children'>;
58
+ theme?: Theme;
59
+ size?: 'default' | 'sm';
60
+ titleSize?: TitleSizeType;
61
+ align?: 'left' | 'center';
62
+ caption?: Array<{
63
+ title: string;
64
+ }>;
65
+ }
4
66
  export interface HeroBannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
5
67
  data: {
6
68
  /** 标签 */
@@ -60,6 +122,17 @@ export interface HeroBannerProps extends Omit<React.HTMLAttributes<HTMLDivElemen
60
122
  caption?: Array<{
61
123
  title: string;
62
124
  }>;
125
+ /**
126
+ * Carousel slide items. When present and non-empty, activates carousel mode.
127
+ * Single-banner mode is used when this field is absent or empty.
128
+ * DECISION-002: items absence = legacy single-banner path.
129
+ */
130
+ items?: HeroBannerSlideData[];
131
+ /**
132
+ * Carousel navigation configuration.
133
+ * Only meaningful when data.items is present and has 2+ items.
134
+ */
135
+ carousel?: HeroBannerCarouselConfig;
63
136
  };
64
137
  onSecondaryClick?: (data: any, e: any, customPrimaryEventId?: string) => void;
65
138
  onPrimaryClick?: (data: any, e: any, customSecondaryEventId?: string) => void;
@@ -14,7 +14,7 @@ export interface ImageOverlayShelfData {
14
14
  /** 产品列表 */
15
15
  productsCard: ProductCardData[];
16
16
  /** 是否显示标签 */
17
- showTags?: boolean;
17
+ isShowTag?: boolean;
18
18
  /** 是否显示原价 */
19
19
  showOriginalPrice?: boolean;
20
20
  /** 了解更多按钮文本 */
@@ -63,7 +63,7 @@ export interface ImageOverlayShelfComponent extends React.ForwardRefExoticCompon
63
63
  ProductCard: typeof ProductCard;
64
64
  }
65
65
  export { ProductCard };
66
- declare const ImageOverlayShelfWrapped: React.ForwardRefExoticComponent<Omit<ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps & React.RefAttributes<unknown>> & {
66
+ declare const ImageOverlayShelfWrapped: React.ForwardRefExoticComponent<Omit<ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../WheelLottery/index.js").ContainerProps & React.RefAttributes<unknown>> & {
67
67
  readonly $$typeof: symbol;
68
68
  ProductCard: typeof ProductCard;
69
69
  };
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as t,jsxs as A}from"react/jsx-runtime";import*as p from"react";import{cn as n}from"../../helpers/utils.js";import{withLayout as D}from"../../shared/Styles.js";import{Swiper as M,SwiperSlide as N}from"swiper/react";import"swiper/css";import{Text as R}from"../../components/text.js";import{Heading as F}from"../../components/heading.js";import{forwardRef as H}from"react";import i from"./ProductCard.js";import{useExposure as L}from"../../hooks/useExposure.js";const k="shelf",E="image_overlay_shelf",c=H(({data:e,onLearnMore:l,onShopNow:m,onAddToCart:u,onProductImageClick:f,classNames:r,copy:y,breakpoints:P,className:g="",...h},v)=>{const a=p.useRef(null);L(a,{componentType:k,componentName:E,componentTitle:e.title,componentDescription:e.description}),p.useImperativeHandle(v,()=>a.current);const{productsCard:o=[],showTags:C=!0,showOriginalPrice:w=!0,secondaryButtonText:S,secondaryButtonFun:T,primaryButtonText:x,primaryButtonFun:B}=e,O={showTags:C,showOriginalPrice:w,secondaryButtonText:S,secondaryButtonFun:T,primaryButtonText:x,primaryButtonFun:B,onLearnMore:l,onShopNow:m,onAddToCart:u,onProductImageClick:f,classNames:r,copy:y},I={0:{spaceBetween:12,slidesPerView:1.2},768:{spaceBetween:16,slidesPerView:o.length<=2?2:2.2},1024:{spaceBetween:16,slidesPerView:o.length<=2?2:3},1440:{spaceBetween:16,slidesPerView:Math.max(2,Math.min(4,o.length))}};return A("div",{ref:a,className:n("collection-shelves-wrap w-full",g,r?.root),...h,children:[e.title&&t(F,{as:"h2",size:4,className:n("text-info-primary mb-4",r?.title),children:e.title}),e.description&&t(R,{size:3,as:"p",className:n("text-info-primary mb-6",r?.description),children:e.description}),t(M,{spaceBetween:16,slidesPerView:"auto",className:"!overflow-visible",breakpoints:P||I,children:o.map((s,b)=>t(N,{children:t(i,{product:s,...O})},s.sku||b))})]})});c.displayName="ImageOverlayShelf";const d=c;d.ProductCard=i;const V=D(d);var U=V;export{i as ProductCard,U as default};
1
+ "use client";import{jsx as t,jsxs as A}from"react/jsx-runtime";import*as p from"react";import{cn as i}from"../../helpers/utils.js";import{withLayout as D}from"../../shared/Styles.js";import{Swiper as M,SwiperSlide as N}from"swiper/react";import"swiper/css";import{Text as R}from"../../components/text.js";import{Heading as F}from"../../components/heading.js";import{forwardRef as H}from"react";import n from"./ProductCard.js";import{useExposure as L}from"../../hooks/useExposure.js";const k="shelf",E="image_overlay_shelf",c=H(({data:e,onLearnMore:l,onShopNow:m,onAddToCart:u,onProductImageClick:f,classNames:r,copy:y,breakpoints:P,className:g="",...h},v)=>{const a=p.useRef(null);L(a,{componentType:k,componentName:E,componentTitle:e.title,componentDescription:e.description}),p.useImperativeHandle(v,()=>a.current);const{productsCard:o=[],isShowTag:C=!0,showOriginalPrice:w=!0,secondaryButtonText:S,secondaryButtonFun:T,primaryButtonText:x,primaryButtonFun:B}=e,O={showTags:C,showOriginalPrice:w,secondaryButtonText:S,secondaryButtonFun:T,primaryButtonText:x,primaryButtonFun:B,onLearnMore:l,onShopNow:m,onAddToCart:u,onProductImageClick:f,classNames:r,copy:y},I={0:{spaceBetween:12,slidesPerView:1.2},768:{spaceBetween:16,slidesPerView:o.length<=2?2:2.2},1024:{spaceBetween:16,slidesPerView:o.length<=2?2:3},1440:{spaceBetween:16,slidesPerView:Math.max(2,Math.min(4,o.length))}};return A("div",{ref:a,className:i("collection-shelves-wrap w-full",g,r?.root),...h,children:[e.title&&t(F,{as:"h2",size:4,className:i("text-info-primary mb-4",r?.title),children:e.title}),e.description&&t(R,{size:3,as:"p",className:i("text-info-primary mb-6",r?.description),children:e.description}),t(M,{spaceBetween:16,slidesPerView:"auto",className:"!overflow-visible",breakpoints:P||I,children:o.map((s,b)=>t(N,{children:t(n,{product:s,...O})},s.sku||b))})]})});c.displayName="ImageOverlayShelf";const d=c;d.ProductCard=n;const V=D(d);var U=V;export{n as ProductCard,U as default};
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/ImageOverlayShelf/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport 'swiper/css'\n\nimport { Text } from '../../components/text.js'\nimport { Heading } from '../../components/heading.js'\nimport { forwardRef } from 'react'\n\nimport ProductCard from './ProductCard.js'\nimport type {\n ProductCardData,\n ProductCardProps,\n ButtonFunctionType,\n ImageOverlayShelfSemanticName,\n CopyConfig,\n} from './types.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nconst componentType = 'shelf'\nconst componentName = 'image_overlay_shelf'\n\n// Re-export types for external use\nexport type {\n ButtonFunctionType,\n ProductCardData,\n ProductCardProps,\n ImageOverlayShelfSemanticName,\n CopyConfig,\n ImageObjectPosition,\n} from './types.js'\n\n/**\n * ImageOverlayShelf \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface ImageOverlayShelfData {\n /** \u7EC4\u4EF6\u6807\u9898 */\n title?: string\n /** \u7EC4\u4EF6\u63CF\u8FF0 */\n description?: string\n /** \u4EA7\u54C1\u5217\u8868 */\n productsCard: ProductCardData[]\n /** \u662F\u5426\u663E\u793A\u6807\u7B7E */\n showTags?: boolean\n /** \u662F\u5426\u663E\u793A\u539F\u4EF7 */\n showOriginalPrice?: boolean\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n secondaryButtonFun?: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n primaryButtonFun?: ButtonFunctionType\n}\n\n/**\n * ImageOverlayShelf Props \u63A5\u53E3\n */\nexport interface ImageOverlayShelfProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: ImageOverlayShelfData\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u4EA7\u54C1\u56FE\u7247\u56DE\u8C03 */\n onProductImageClick?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ImageOverlayShelfSemanticName, string>>\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n /** \u65AD\u70B9\u914D\u7F6E */\n breakpoints?: {\n [key: number]: {\n spaceBetween: number\n freeMode: boolean\n slidesPerView: number\n }\n }\n}\n\n/**\n * ImageOverlayShelf \u590D\u5408\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface ImageOverlayShelfComponent extends React.ForwardRefExoticComponent<\n ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>\n> {\n /** \u72EC\u7ACB\u7684 ProductCard \u7EC4\u4EF6 */\n ProductCard: typeof ProductCard\n}\n\n/**\n * \u5171\u4EAB Props \u7C7B\u578B\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n */\ntype SharedProductCardProps = Omit<ProductCardProps, 'product' | 'className'>\n\nconst ImageOverlayShelf = forwardRef<HTMLDivElement, ImageOverlayShelfProps>(\n (\n {\n data,\n onLearnMore,\n onShopNow,\n onAddToCart,\n onProductImageClick,\n classNames,\n copy,\n breakpoints,\n className = '',\n ...props\n },\n ref\n ) => {\n const boxRef = React.useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: data.title,\n componentDescription: data.description,\n })\n\n React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n const {\n productsCard: products = [],\n showTags = true,\n showOriginalPrice = true,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n } = data\n\n // \u6784\u5EFA\u5171\u4EAB props\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n const sharedProps: SharedProductCardProps = {\n showTags,\n showOriginalPrice,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n onLearnMore,\n onShopNow,\n onAddToCart,\n onProductImageClick,\n classNames,\n copy,\n }\n\n // \u9ED8\u8BA4\u65AD\u70B9\u914D\u7F6E\n const defaultBreakpoints = {\n 0: {\n spaceBetween: 12,\n slidesPerView: 1.2,\n },\n 768: {\n spaceBetween: 16,\n slidesPerView: products.length <= 2 ? 2 : 2.2,\n },\n 1024: {\n spaceBetween: 16,\n slidesPerView: products.length <= 2 ? 2 : 3,\n },\n 1440: {\n spaceBetween: 16,\n slidesPerView: Math.max(2, Math.min(4, products.length)),\n },\n }\n\n return (\n <div ref={boxRef} className={cn('collection-shelves-wrap w-full', className, classNames?.root)} {...props}>\n {/* \u6807\u9898\u533A\u57DF */}\n {data.title && (\n <Heading as=\"h2\" size={4} className={cn('text-info-primary mb-4', classNames?.title)}>\n {data.title}\n </Heading>\n )}\n {data.description && (\n <Text size={3} as=\"p\" className={cn('text-info-primary mb-6', classNames?.description)}>\n {data.description}\n </Text>\n )}\n\n {/* Swiper \u6A2A\u5411\u6ED1\u52A8\u5E03\u5C40 */}\n <Swiper\n spaceBetween={16}\n slidesPerView=\"auto\"\n className=\"!overflow-visible\"\n breakpoints={breakpoints || defaultBreakpoints}\n >\n {products.map((product, index) => (\n <SwiperSlide key={product.sku || index}>\n <ProductCard product={product} {...sharedProps} />\n </SwiperSlide>\n ))}\n </Swiper>\n </div>\n )\n }\n)\n\nImageOverlayShelf.displayName = 'ImageOverlayShelf'\n\n// \u521B\u5EFA\u590D\u5408\u7EC4\u4EF6\nconst ImageOverlayShelfWithProductCard = ImageOverlayShelf as ImageOverlayShelfComponent\nImageOverlayShelfWithProductCard.ProductCard = ProductCard\n\nexport { ProductCard }\nconst ImageOverlayShelfWrapped = withLayout(ImageOverlayShelfWithProductCard)\nexport default ImageOverlayShelfWrapped\n"],
5
- "mappings": "aAkLM,OAGI,OAAAA,EAHJ,QAAAC,MAAA,oBAjLN,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAE3B,OAAS,UAAAC,EAAQ,eAAAC,MAAmB,eACpC,MAAO,aAEP,OAAS,QAAAC,MAAY,2BACrB,OAAS,WAAAC,MAAe,8BACxB,OAAS,cAAAC,MAAkB,QAE3B,OAAOC,MAAiB,mBAQxB,OAAS,eAAAC,MAAmB,6BAE5B,MAAMC,EAAgB,QAChBC,EAAgB,sBAiFhBC,EAAoBL,EACxB,CACE,CACE,KAAAM,EACA,YAAAC,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAASxB,EAAM,OAAuB,IAAI,EAEhDS,EAAYe,EAAQ,CAClB,cAAAd,EACA,cAAAC,EACA,eAAgBE,EAAK,MACrB,qBAAsBA,EAAK,WAC7B,CAAC,EAEDb,EAAM,oBAAoBuB,EAAK,IAAMC,EAAO,OAAyB,EAErE,KAAM,CACJ,aAAcC,EAAW,CAAC,EAC1B,SAAAC,EAAW,GACX,kBAAAC,EAAoB,GACpB,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,CACF,EAAIlB,EAGEmB,EAAsC,CAC1C,SAAAN,EACA,kBAAAC,EACA,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,YAAAjB,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,CACF,EAGMc,EAAqB,CACzB,EAAG,CACD,aAAc,GACd,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,cAAeR,EAAS,QAAU,EAAI,EAAI,GAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAeA,EAAS,QAAU,EAAI,EAAI,CAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAe,KAAK,IAAI,EAAG,KAAK,IAAI,EAAGA,EAAS,MAAM,CAAC,CACzD,CACF,EAEA,OACE1B,EAAC,OAAI,IAAKyB,EAAQ,UAAWvB,EAAG,iCAAkCoB,EAAWH,GAAY,IAAI,EAAI,GAAGI,EAEjG,UAAAT,EAAK,OACJf,EAACQ,EAAA,CAAQ,GAAG,KAAK,KAAM,EAAG,UAAWL,EAAG,yBAA0BiB,GAAY,KAAK,EAChF,SAAAL,EAAK,MACR,EAEDA,EAAK,aACJf,EAACO,EAAA,CAAK,KAAM,EAAG,GAAG,IAAI,UAAWJ,EAAG,yBAA0BiB,GAAY,WAAW,EAClF,SAAAL,EAAK,YACR,EAIFf,EAACK,EAAA,CACC,aAAc,GACd,cAAc,OACd,UAAU,oBACV,YAAaiB,GAAea,EAE3B,SAAAR,EAAS,IAAI,CAACS,EAASC,IACtBrC,EAACM,EAAA,CACC,SAAAN,EAACU,EAAA,CAAY,QAAS0B,EAAU,GAAGF,EAAa,GADhCE,EAAQ,KAAOC,CAEjC,CACD,EACH,GACF,CAEJ,CACF,EAEAvB,EAAkB,YAAc,oBAGhC,MAAMwB,EAAmCxB,EACzCwB,EAAiC,YAAc5B,EAG/C,MAAM6B,EAA2BnC,EAAWkC,CAAgC,EAC5E,IAAOE,EAAQD",
6
- "names": ["jsx", "jsxs", "React", "cn", "withLayout", "Swiper", "SwiperSlide", "Text", "Heading", "forwardRef", "ProductCard", "useExposure", "componentType", "componentName", "ImageOverlayShelf", "data", "onLearnMore", "onShopNow", "onAddToCart", "onProductImageClick", "classNames", "copy", "breakpoints", "className", "props", "ref", "boxRef", "products", "showTags", "showOriginalPrice", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "sharedProps", "defaultBreakpoints", "product", "index", "ImageOverlayShelfWithProductCard", "ImageOverlayShelfWrapped", "ImageOverlayShelf_default"]
4
+ "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport 'swiper/css'\n\nimport { Text } from '../../components/text.js'\nimport { Heading } from '../../components/heading.js'\nimport { forwardRef } from 'react'\n\nimport ProductCard from './ProductCard.js'\nimport type {\n ProductCardData,\n ProductCardProps,\n ButtonFunctionType,\n ImageOverlayShelfSemanticName,\n CopyConfig,\n} from './types.js'\nimport { useExposure } from '../../hooks/useExposure.js'\n\nconst componentType = 'shelf'\nconst componentName = 'image_overlay_shelf'\n\n// Re-export types for external use\nexport type {\n ButtonFunctionType,\n ProductCardData,\n ProductCardProps,\n ImageOverlayShelfSemanticName,\n CopyConfig,\n ImageObjectPosition,\n} from './types.js'\n\n/**\n * ImageOverlayShelf \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface ImageOverlayShelfData {\n /** \u7EC4\u4EF6\u6807\u9898 */\n title?: string\n /** \u7EC4\u4EF6\u63CF\u8FF0 */\n description?: string\n /** \u4EA7\u54C1\u5217\u8868 */\n productsCard: ProductCardData[]\n /** \u662F\u5426\u663E\u793A\u6807\u7B7E */\n isShowTag?: boolean\n /** \u662F\u5426\u663E\u793A\u539F\u4EF7 */\n showOriginalPrice?: boolean\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n secondaryButtonFun?: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n primaryButtonFun?: ButtonFunctionType\n}\n\n/**\n * ImageOverlayShelf Props \u63A5\u53E3\n */\nexport interface ImageOverlayShelfProps extends React.HTMLAttributes<HTMLDivElement> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: ImageOverlayShelfData\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u4EA7\u54C1\u56FE\u7247\u56DE\u8C03 */\n onProductImageClick?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ImageOverlayShelfSemanticName, string>>\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n /** \u65AD\u70B9\u914D\u7F6E */\n breakpoints?: {\n [key: number]: {\n spaceBetween: number\n freeMode: boolean\n slidesPerView: number\n }\n }\n}\n\n/**\n * ImageOverlayShelf \u590D\u5408\u7EC4\u4EF6\u7C7B\u578B\u5B9A\u4E49\n */\nexport interface ImageOverlayShelfComponent extends React.ForwardRefExoticComponent<\n ImageOverlayShelfProps & React.RefAttributes<HTMLDivElement>\n> {\n /** \u72EC\u7ACB\u7684 ProductCard \u7EC4\u4EF6 */\n ProductCard: typeof ProductCard\n}\n\n/**\n * \u5171\u4EAB Props \u7C7B\u578B\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n */\ntype SharedProductCardProps = Omit<ProductCardProps, 'product' | 'className'>\n\nconst ImageOverlayShelf = forwardRef<HTMLDivElement, ImageOverlayShelfProps>(\n (\n {\n data,\n onLearnMore,\n onShopNow,\n onAddToCart,\n onProductImageClick,\n classNames,\n copy,\n breakpoints,\n className = '',\n ...props\n },\n ref\n ) => {\n const boxRef = React.useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: data.title,\n componentDescription: data.description,\n })\n\n React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n const {\n productsCard: products = [],\n isShowTag = true,\n showOriginalPrice = true,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n } = data\n\n // \u6784\u5EFA\u5171\u4EAB props\uFF08\u900F\u4F20\u7ED9 ProductCard\uFF09\n const sharedProps: SharedProductCardProps = {\n showTags: isShowTag,\n showOriginalPrice,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n onLearnMore,\n onShopNow,\n onAddToCart,\n onProductImageClick,\n classNames,\n copy,\n }\n\n // \u9ED8\u8BA4\u65AD\u70B9\u914D\u7F6E\n const defaultBreakpoints = {\n 0: {\n spaceBetween: 12,\n slidesPerView: 1.2,\n },\n 768: {\n spaceBetween: 16,\n slidesPerView: products.length <= 2 ? 2 : 2.2,\n },\n 1024: {\n spaceBetween: 16,\n slidesPerView: products.length <= 2 ? 2 : 3,\n },\n 1440: {\n spaceBetween: 16,\n slidesPerView: Math.max(2, Math.min(4, products.length)),\n },\n }\n\n return (\n <div ref={boxRef} className={cn('collection-shelves-wrap w-full', className, classNames?.root)} {...props}>\n {/* \u6807\u9898\u533A\u57DF */}\n {data.title && (\n <Heading as=\"h2\" size={4} className={cn('text-info-primary mb-4', classNames?.title)}>\n {data.title}\n </Heading>\n )}\n {data.description && (\n <Text size={3} as=\"p\" className={cn('text-info-primary mb-6', classNames?.description)}>\n {data.description}\n </Text>\n )}\n\n {/* Swiper \u6A2A\u5411\u6ED1\u52A8\u5E03\u5C40 */}\n <Swiper\n spaceBetween={16}\n slidesPerView=\"auto\"\n className=\"!overflow-visible\"\n breakpoints={breakpoints || defaultBreakpoints}\n >\n {products.map((product, index) => (\n <SwiperSlide key={product.sku || index}>\n <ProductCard product={product} {...sharedProps} />\n </SwiperSlide>\n ))}\n </Swiper>\n </div>\n )\n }\n)\n\nImageOverlayShelf.displayName = 'ImageOverlayShelf'\n\n// \u521B\u5EFA\u590D\u5408\u7EC4\u4EF6\nconst ImageOverlayShelfWithProductCard = ImageOverlayShelf as ImageOverlayShelfComponent\nImageOverlayShelfWithProductCard.ProductCard = ProductCard\n\nexport { ProductCard }\nconst ImageOverlayShelfWrapped = withLayout(ImageOverlayShelfWithProductCard)\nexport default ImageOverlayShelfWrapped\n"],
5
+ "mappings": "aAkLM,OAGI,OAAAA,EAHJ,QAAAC,MAAA,oBAjLN,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,yBACnB,OAAS,cAAAC,MAAkB,yBAE3B,OAAS,UAAAC,EAAQ,eAAAC,MAAmB,eACpC,MAAO,aAEP,OAAS,QAAAC,MAAY,2BACrB,OAAS,WAAAC,MAAe,8BACxB,OAAS,cAAAC,MAAkB,QAE3B,OAAOC,MAAiB,mBAQxB,OAAS,eAAAC,MAAmB,6BAE5B,MAAMC,EAAgB,QAChBC,EAAgB,sBAiFhBC,EAAoBL,EACxB,CACE,CACE,KAAAM,EACA,YAAAC,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,EACAC,IACG,CACH,MAAMC,EAASxB,EAAM,OAAuB,IAAI,EAEhDS,EAAYe,EAAQ,CAClB,cAAAd,EACA,cAAAC,EACA,eAAgBE,EAAK,MACrB,qBAAsBA,EAAK,WAC7B,CAAC,EAEDb,EAAM,oBAAoBuB,EAAK,IAAMC,EAAO,OAAyB,EAErE,KAAM,CACJ,aAAcC,EAAW,CAAC,EAC1B,UAAAC,EAAY,GACZ,kBAAAC,EAAoB,GACpB,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,CACF,EAAIlB,EAGEmB,EAAsC,CAC1C,SAAUN,EACV,kBAAAC,EACA,oBAAAC,EACA,mBAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,YAAAjB,EACA,UAAAC,EACA,YAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,KAAAC,CACF,EAGMc,EAAqB,CACzB,EAAG,CACD,aAAc,GACd,cAAe,GACjB,EACA,IAAK,CACH,aAAc,GACd,cAAeR,EAAS,QAAU,EAAI,EAAI,GAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAeA,EAAS,QAAU,EAAI,EAAI,CAC5C,EACA,KAAM,CACJ,aAAc,GACd,cAAe,KAAK,IAAI,EAAG,KAAK,IAAI,EAAGA,EAAS,MAAM,CAAC,CACzD,CACF,EAEA,OACE1B,EAAC,OAAI,IAAKyB,EAAQ,UAAWvB,EAAG,iCAAkCoB,EAAWH,GAAY,IAAI,EAAI,GAAGI,EAEjG,UAAAT,EAAK,OACJf,EAACQ,EAAA,CAAQ,GAAG,KAAK,KAAM,EAAG,UAAWL,EAAG,yBAA0BiB,GAAY,KAAK,EAChF,SAAAL,EAAK,MACR,EAEDA,EAAK,aACJf,EAACO,EAAA,CAAK,KAAM,EAAG,GAAG,IAAI,UAAWJ,EAAG,yBAA0BiB,GAAY,WAAW,EAClF,SAAAL,EAAK,YACR,EAIFf,EAACK,EAAA,CACC,aAAc,GACd,cAAc,OACd,UAAU,oBACV,YAAaiB,GAAea,EAE3B,SAAAR,EAAS,IAAI,CAACS,EAASC,IACtBrC,EAACM,EAAA,CACC,SAAAN,EAACU,EAAA,CAAY,QAAS0B,EAAU,GAAGF,EAAa,GADhCE,EAAQ,KAAOC,CAEjC,CACD,EACH,GACF,CAEJ,CACF,EAEAvB,EAAkB,YAAc,oBAGhC,MAAMwB,EAAmCxB,EACzCwB,EAAiC,YAAc5B,EAG/C,MAAM6B,EAA2BnC,EAAWkC,CAAgC,EAC5E,IAAOE,EAAQD",
6
+ "names": ["jsx", "jsxs", "React", "cn", "withLayout", "Swiper", "SwiperSlide", "Text", "Heading", "forwardRef", "ProductCard", "useExposure", "componentType", "componentName", "ImageOverlayShelf", "data", "onLearnMore", "onShopNow", "onAddToCart", "onProductImageClick", "classNames", "copy", "breakpoints", "className", "props", "ref", "boxRef", "products", "isShowTag", "showOriginalPrice", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "sharedProps", "defaultBreakpoints", "product", "index", "ImageOverlayShelfWithProductCard", "ImageOverlayShelfWrapped", "ImageOverlayShelf_default"]
7
7
  }
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import type { ImageTextFeatureProps } from './types.js';
3
- declare const _default: React.ForwardRefExoticComponent<Omit<ImageTextFeatureProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps & React.RefAttributes<unknown>> & {
3
+ declare const _default: React.ForwardRefExoticComponent<Omit<ImageTextFeatureProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../WheelLottery/index.js").ContainerProps & React.RefAttributes<unknown>> & {
4
4
  readonly $$typeof: symbol;
5
5
  };
6
6
  export default _default;
@@ -0,0 +1,9 @@
1
+ import * as React from 'react';
2
+ import type { ImageTextOverlayProps, ImageTextOverlayItem, ImageTextOverlaySemanticName, ImageTextOverlayData, ImageTextOverlayBackgroundImage } from './types.js';
3
+ import 'swiper/css';
4
+ import 'swiper/css/pagination';
5
+ export type { ImageTextOverlayProps, ImageTextOverlayItem, ImageTextOverlaySemanticName, ImageTextOverlayData, ImageTextOverlayBackgroundImage, };
6
+ declare const _default: React.ForwardRefExoticComponent<Omit<ImageTextOverlayProps & React.RefAttributes<HTMLDivElement>, "container" | keyof import("../../shared/Styles.js").StylesProps> & import("../../shared/Styles.js").StylesProps & import("../WheelLottery/index.js").ContainerProps & React.RefAttributes<unknown>> & {
7
+ readonly $$typeof: symbol;
8
+ };
9
+ export default _default;
@@ -0,0 +1,18 @@
1
+ "use client";import{Fragment as W,jsx as a,jsxs as x}from"react/jsx-runtime";import*as k from"react";import{forwardRef as $,useEffect as R,useState as C}from"react";import{cn as r}from"../../helpers/utils.js";import{Heading as P}from"../../components/heading.js";import{Text as D}from"../../components/text.js";import _ from"../../components/picture.js";import{useExposure as I}from"../../hooks/useExposure.js";import{withLayout as A}from"../../shared/Styles.js";import{trackUrlRef as z}from"../../shared/trackUrlRef.js";import{getLocalizedPath as L}from"../../helpers/utils.js";import{useAiuiContext as B}from"../AiuiProvider/index.js";import{useMediaQuery as E}from"react-responsive";import{Swiper as H,SwiperSlide as M}from"swiper/react";import{Pagination as j}from"swiper/modules";import"swiper/css";import"swiper/css/pagination";const V="content",f="image_text_overlay",h="image",w="image-text-overlay-mobile-pagination",v={default:767,tablet:1024,laptop:1439,desktop:1919,lgDesktop:9999},F=e=>{if(!e)return"";const t=[];return e.lgDesktop?.url&&t.push(`${e.lgDesktop.url}`),e.desktop?.url&&t.push(`${e.desktop.url} ${v.desktop}`),e.laptop?.url&&t.push(`${e.laptop.url} ${v.laptop}`),e.tablet?.url&&t.push(`${e.tablet.url} ${v.tablet}`),e.default?.url&&t.push(`${e.default.url} ${v.default}`),t.join(", ")},G=e=>e&&(e.default?.alt||e.tablet?.alt||e.laptop?.alt||e.desktop?.alt||e.lgDesktop?.alt)||"",Q=(e,t)=>{const s=[];for(let l=0;l<e.length;l+=t)s.push(e.slice(l,l+t));return s},q=e=>{switch(e){case 2:return"grid-cols-1 tablet:grid-cols-2";case 3:return"grid-cols-1 tablet:grid-cols-2 laptop:grid-cols-3";case 4:return"grid-cols-1 tablet:grid-cols-2";case 5:return"grid-cols-1 tablet:grid-cols-2 laptop:grid-cols-6";case 6:return"grid-cols-1 tablet:grid-cols-2 desktop:grid-cols-3";default:return e<=1?"grid-cols-1":"grid-cols-1 laptop:grid-cols-3"}},K=(e,t)=>t===5?e<2?"laptop:col-span-3":"laptop:col-span-2":"",U=(e,t)=>{switch(e){case 2:case 4:return"aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[648/256] lg-desktop:aspect-[824/320]";case 3:return"aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[288/192] desktop:aspect-[427/256] lg-desktop:aspect-[544/320]";case 5:return t<2?"aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[648/256] lg-desktop:aspect-[824/320]":"aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[288/192] desktop:aspect-[427/256] lg-desktop:aspect-[544/320]";case 6:return"aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[427/256] lg-desktop:aspect-[544/320]";default:return e<=1?"aspect-[358/240]":"aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[648/256] lg-desktop:aspect-[824/320]"}},O=({item:e,index:t,count:s,classNames:l})=>{const d=F(e.backgroundImage),c=G(e.backgroundImage),i=K(t,s),u=k.useRef(null),{locale:y="us",pageHandle:m}=B();I(u,{componentType:h,componentName:f,position:t+1,componentTitle:e.title,componentDescription:e.subtitle});const o=e.link?L(e.link,y):void 0,g=o?z(o,`${m??""}_${h}_${f}`):void 0,b=`${e.title}#${e.subtitle||""}#${e.title}`,n=U(s,t);return x("div",{ref:u,className:r("image-text-overlay-card rounded-card",{"aiui-dark":e.theme==="dark"},"desktop:p-6 lg-desktop:p-8 group relative flex flex-col items-start justify-end overflow-hidden p-4",n,i,l?.card),children:[g&&a("a",{href:g,className:"absolute inset-0 z-20","aria-label":e.title,"data-headless-type-name":`${h}#${f}`,"data-headless-title-desc-button":b}),e.backgroundImage?.isShowVideo?x(W,{children:[e.backgroundImage?.mobileVideo&&a("video",{className:r("image-text-overlay-card-image","laptop:hidden absolute inset-0 size-full object-cover",l?.cardImage),src:e.backgroundImage.mobileVideo.url,autoPlay:!0,muted:!0,loop:!0,playsInline:!0}),e.backgroundImage?.desktopVideo&&a("video",{className:r("image-text-overlay-card-image","laptop:block absolute inset-0 hidden size-full object-cover",l?.cardImage),src:e.backgroundImage.desktopVideo.url,autoPlay:!0,muted:!0,loop:!0,playsInline:!0})]}):d&&a(_,{source:d,alt:c||e.title,className:r("image-text-overlay-card-image","absolute inset-0 size-full",l?.cardImage),imgClassName:"size-full object-cover cursor-pointer transition-all duration-300 group-hover:scale-105"}),x("div",{className:r("image-text-overlay-card-content","relative z-10 flex w-full flex-col gap-1",l?.cardContent),children:[a(P,{as:"h4",size:2,weight:"bold",className:r("image-text-overlay-card-title text-info-primary line-clamp-1","w-full leading-[1.2] tracking-[-0.04em]","desktop:text-xl lg-desktop:text-2xl text-lg",l?.cardTitle),children:e.title}),e.subtitle&&a(D,{as:"p",size:"none",weight:"bold",className:r("image-text-overlay-card-subtitle text-info-primary line-clamp-1","w-full truncate leading-[1.4] tracking-[-0.02em]","lg-desktop:text-base text-sm",s<=3&&"lg-desktop:text-lg",l?.cardSubtitle),children:e.subtitle})]})]})},S=$(({data:e,className:t,classNames:s={},...l},d)=>{const c=k.useRef(null),{items:i=[]}=e,[u,y]=C(!1),m=E({query:"(max-width: 767px)"});if(R(()=>{y(m)},[m]),I(c,{componentType:V,componentName:f}),k.useImperativeHandle(d,()=>c.current),!i.length)return null;const o=i.length,g=o>3&&u,b=Q(i,3);return a("div",{ref:c,className:r("image-text-overlay-root",t,s.root),"data-ui-component-id":"ImageTextOverlay",...l,children:g?x("div",{className:"image-text-overlay-mobile-swiper relative pb-8",children:[a(H,{className:"w-full [&_.swiper-slide]:!h-auto [&_.swiper-wrapper]:items-stretch",modules:[j],slidesPerView:1,pagination:{clickable:!0,el:`.${w}`,bulletClass:"image-text-overlay-bullet",bulletActiveClass:"image-text-overlay-bullet-active"},spaceBetween:16,children:b.map((n,p)=>a(M,{className:"!h-auto",children:a("div",{className:"flex flex-col gap-4",children:n.map((N,T)=>a(O,{item:N,index:p*3+T,count:o,classNames:s},p*3+T))})},p))}),a("div",{className:"absolute inset-x-0 bottom-0 z-10 flex justify-center",children:a("div",{className:r(w,"flex items-center justify-center gap-2 text-center","[&_.swiper-pagination-bullet]:m-0","[&_.swiper-pagination-bullet]:shrink-0","[&_.swiper-pagination-bullet]:opacity-100")})}),a("style",{children:`
2
+ .image-text-overlay-bullet {
3
+ display: inline-block;
4
+ width: 8px;
5
+ height: 8px;
6
+ border-radius: 9999px;
7
+ background: #767880;
8
+ transition: all 0.3s ease;
9
+ }
10
+
11
+ .image-text-overlay-bullet-active {
12
+ width: 32px;
13
+ height: 8px;
14
+ border-radius: 9999px;
15
+ background: #080A0F;
16
+ }
17
+ `})]}):a("div",{className:r("image-text-overlay-grid","grid gap-4",q(o),s.grid),children:i.map((n,p)=>a(O,{item:n,index:p,count:o,classNames:s},p))})})});S.displayName="ImageTextOverlay";var ue=A(S);export{ue as default};
18
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/biz-components/ImageTextOverlay/index.tsx"],
4
+ "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { Heading } from '../../components/heading.js'\nimport { Text } from '../../components/text.js'\nimport Picture from '../../components/picture.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type {\n ImageTextOverlayProps,\n ImageTextOverlayItem,\n ImageTextOverlaySemanticName,\n ImageTextOverlayData,\n ImageTextOverlayBackgroundImage,\n} from './types.js'\nimport { getLocalizedPath } from '../../helpers/utils.js'\nimport { useAiuiContext } from '../AiuiProvider/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { Swiper, SwiperSlide } from 'swiper/react'\nimport { Pagination } from 'swiper/modules'\nimport 'swiper/css'\nimport 'swiper/css/pagination'\n\nexport type {\n ImageTextOverlayProps,\n ImageTextOverlayItem,\n ImageTextOverlaySemanticName,\n ImageTextOverlayData,\n ImageTextOverlayBackgroundImage,\n}\n\nconst componentType = 'content'\nconst componentName = 'image_text_overlay'\nconst imageComponentType = 'image'\nconst MOBILE_SWIPER_PAGINATION_CLASS = 'image-text-overlay-mobile-pagination'\n\n/**\n * \u65AD\u70B9\u914D\u7F6E\uFF08\u4E0E Tailwind \u65AD\u70B9\u5BF9\u5E94\uFF09\n * Picture \u7EC4\u4EF6\u4F7F\u7528 max-width \u5A92\u4F53\u67E5\u8BE2\uFF0C\u6240\u4EE5\u9700\u8981\u6309\u4ECE\u5927\u5230\u5C0F\u7684\u987A\u5E8F\u6392\u5217\n */\nconst BREAKPOINTS = {\n default: 767, // <768px (\u79FB\u52A8\u7AEF)\n tablet: 1024, // 768px - 1024px\n laptop: 1439, // 1025px - 1439px\n desktop: 1919, // 1440px - 1919px\n lgDesktop: 9999, // \u22651920px\n} as const\n\n/**\n * \u5C06\u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u5BF9\u8C61\u8F6C\u6362\u4E3A Picture \u7EC4\u4EF6\u7684 source \u5B57\u7B26\u4E32\n * \u683C\u5F0F: \"lgDesktopUrl, desktopUrl 1919, laptopUrl 1439, tabletUrl 1024, defaultUrl 767\"\n */\nconst buildResponsiveSource = (backgroundImage?: ImageTextOverlayBackgroundImage): string => {\n if (!backgroundImage) return ''\n\n const sources: string[] = []\n\n // lgDesktop \u4F5C\u4E3A\u9ED8\u8BA4\u56FE\u7247\uFF08\u65E0\u65AD\u70B9\u503C\uFF09\n if (backgroundImage.lgDesktop?.url) {\n sources.push(`${backgroundImage.lgDesktop.url}`)\n }\n if (backgroundImage.desktop?.url) {\n sources.push(`${backgroundImage.desktop.url} ${BREAKPOINTS.desktop}`)\n }\n if (backgroundImage.laptop?.url) {\n sources.push(`${backgroundImage.laptop.url} ${BREAKPOINTS.laptop}`)\n }\n if (backgroundImage.tablet?.url) {\n sources.push(`${backgroundImage.tablet.url} ${BREAKPOINTS.tablet}`)\n }\n if (backgroundImage.default?.url) {\n sources.push(`${backgroundImage.default.url} ${BREAKPOINTS.default}`)\n }\n\n return sources.join(', ')\n}\n\n/**\n * \u83B7\u53D6\u54CD\u5E94\u5F0F\u80CC\u666F\u56FE\u7247\u7684\u9ED8\u8BA4 alt \u6587\u672C\n */\nconst getBackgroundAlt = (backgroundImage?: ImageTextOverlayBackgroundImage): string => {\n if (!backgroundImage) return ''\n return (\n backgroundImage.default?.alt ||\n backgroundImage.tablet?.alt ||\n backgroundImage.laptop?.alt ||\n backgroundImage.desktop?.alt ||\n backgroundImage.lgDesktop?.alt ||\n ''\n )\n}\n\n// ============================================================================\n// \u54CD\u5E94\u5F0F\u5E03\u5C40\u7C7B\u540D \u2014\u2014 \u6839\u636E items \u6570\u91CF\u52A8\u6001\u51B3\u5B9A\u7F51\u683C\u5217\u6570\n//\n// Figma \u8BBE\u8BA1\u89C4\u8303\u603B\u7ED3:\n//\n// | Count | <768 (mobile) | 768-1024 (tablet) | 1025-1440 (laptop) | 1441-1920 (desktop) | \u22651921 (lg-desktop) |\n// |-------|---------------|--------------------|--------------------|---------------------|--------------------|\n// | 2 | 1col | 2col | 2col | 2col | 2col |\n// | 3 | 1col | 2col (2+1) | 3col | 3col | 3col |\n// | 4 | 2col (2 rows) | 2col (2 rows) | 2col (2 rows) | 2col (2 rows) | 2col (2 rows) |\n// | 5 | 2col (3 rows) | 2col (3 rows) | 2+3 (5col flex) | 2+3 (5col flex) | 2+3 (5col flex) |\n// | 6 | 2col (3 rows) | 2col (3 rows) | 3col (2 rows) | 3col (2 rows) | 3col (2 rows) |\n//\n// ============================================================================\n\n/**\n * \u5C06\u6570\u7EC4\u6309\u6307\u5B9A\u5927\u5C0F\u5206\u7EC4\n */\nconst chunkArray = <T,>(arr: T[], size: number): T[][] => {\n const chunks: T[][] = []\n for (let i = 0; i < arr.length; i += size) {\n chunks.push(arr.slice(i, i + size))\n }\n return chunks\n}\n\n/**\n * \u83B7\u53D6\u5BB9\u5668\u7F51\u683C\u7C7B\u540D\uFF08\u6839\u636E items \u6570\u91CF\uFF09\n */\nconst getGridClasses = (count: number): string => {\n switch (count) {\n case 2:\n // mobile: 1col, tablet+: 2col\n return 'grid-cols-1 tablet:grid-cols-2'\n case 3:\n // mobile: 1col, tablet: 2col, laptop+: 3col\n return 'grid-cols-1 tablet:grid-cols-2 laptop:grid-cols-3'\n case 4:\n // mobile: 2col, tablet+: 2col (uniform)\n return 'grid-cols-1 tablet:grid-cols-2'\n case 5:\n // mobile/tablet: 2col grid, laptop+: use flex layout instead (2+3 pattern)\n // We handle laptop+ separately via flex, grid for mobile/tablet only\n return 'grid-cols-1 tablet:grid-cols-2 laptop:grid-cols-6'\n case 6:\n // mobile/tablet: 2col, laptop+: 3col\n return 'grid-cols-1 tablet:grid-cols-2 desktop:grid-cols-3'\n default:\n if (count <= 1) return 'grid-cols-1'\n // fallback: 2col mobile, 3col laptop+\n return 'grid-cols-1 laptop:grid-cols-3'\n }\n}\n\n/**\n * \u83B7\u53D6\u5355\u4E2A item \u7684 span \u7C7B\u540D (\u4EC5\u7528\u4E8E count=3 tablet \u548C count=5 laptop+)\n */\nconst getItemSpanClasses = (index: number, count: number): string => {\n if (count === 5) {\n // laptop+: \u7B2C1\u884C 2 items \u5404 span 3, \u7B2C2\u884C 3 items \u5404 span 2\n if (index < 2) return 'laptop:col-span-3'\n return 'laptop:col-span-2'\n }\n return ''\n}\n\n/**\n * \u83B7\u53D6\u5361\u7247\u5BBD\u9AD8\u6BD4\u7C7B\u540D\n * \u6839\u636E items \u6570\u91CF\u548C\u65AD\u70B9\u52A8\u6001\u8BA1\u7B97\uFF0C\u786E\u4FDD\u56FE\u7247\u4E0D\u88AB\u622A\u65AD\n */\nconst getAspectRatioClasses = (count: number, index: number): string => {\n switch (count) {\n case 2:\n case 4:\n // \u59CB\u7EC8 2 \u5217\n return 'aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[648/256] lg-desktop:aspect-[824/320]'\n case 3:\n // tablet 2 \u5217, laptop+ 3 \u5217\n return 'aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[288/192] desktop:aspect-[427/256] lg-desktop:aspect-[544/320]'\n case 5:\n // tablet 2 \u5217, laptop+ \u7279\u6B8A flex (\u9996\u884C 2 \u4E2A\u5404\u5360 50%, \u6B21\u884C 3 \u4E2A\u5404\u5360 33%)\n // \u7B2C\u4E00\u884C\uFF08index 0-1\uFF09\u7528 2 \u5217\u5BBD\u9AD8\u6BD4\uFF0C\u7B2C\u4E8C\u884C\uFF08index 2-4\uFF09\u7528 3 \u5217\u5BBD\u9AD8\u6BD4\uFF0C\u786E\u4FDD\u9AD8\u5EA6\u4E00\u81F4\n if (index < 2) {\n return 'aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[648/256] lg-desktop:aspect-[824/320]'\n }\n return 'aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[288/192] desktop:aspect-[427/256] lg-desktop:aspect-[544/320]'\n case 6:\n // tablet/laptop 2 \u5217, desktop+ 3 \u5217\n return 'aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[427/256] lg-desktop:aspect-[544/320]'\n default:\n if (count <= 1) return 'aspect-[358/240]'\n return 'aspect-[358/240] tablet:aspect-[346/240] laptop:aspect-[440/192] desktop:aspect-[648/256] lg-desktop:aspect-[824/320]'\n }\n}\n\n/**\n * ImageTextOverlayCard - \u5355\u4E2A\u56FE\u6587\u53E0\u52A0\u5361\u7247\n */\nconst ImageTextOverlayCard: React.FC<{\n item: ImageTextOverlayItem\n index: number\n count: number\n classNames?: Partial<Record<ImageTextOverlaySemanticName, string>>\n}> = ({ item, index, count, classNames }) => {\n const responsiveSource = buildResponsiveSource(item.backgroundImage)\n const defaultAlt = getBackgroundAlt(item.backgroundImage)\n const spanClasses = getItemSpanClasses(index, count)\n const imageRef = React.useRef<HTMLDivElement>(null)\n const { locale = 'us', pageHandle } = useAiuiContext()\n\n useExposure(imageRef, {\n componentType: imageComponentType,\n componentName,\n position: index + 1,\n componentTitle: item.title,\n componentDescription: item.subtitle,\n })\n\n const localizedLink = item.link ? getLocalizedPath(item.link, locale) : undefined\n const trackedLink = localizedLink\n ? trackUrlRef(localizedLink, `${pageHandle ?? ''}_${imageComponentType}_${componentName}`)\n : undefined\n const titleDescButton = `${item.title}#${item.subtitle || ''}#${item.title}`\n\n const aspectRatioClasses = getAspectRatioClasses(count, index)\n\n return (\n <div\n ref={imageRef}\n className={cn(\n 'image-text-overlay-card rounded-card',\n { 'aiui-dark': item.theme === 'dark' },\n 'desktop:p-6 lg-desktop:p-8 group relative flex flex-col items-start justify-end overflow-hidden p-4',\n aspectRatioClasses,\n spanClasses,\n classNames?.card\n )}\n >\n {/* \u6574\u5361\u94FE\u63A5 */}\n {trackedLink && (\n <a\n href={trackedLink}\n className=\"absolute inset-0 z-20\"\n aria-label={item.title}\n data-headless-type-name={`${imageComponentType}#${componentName}`}\n data-headless-title-desc-button={titleDescButton}\n />\n )}\n\n {/* \u80CC\u666F\u5A92\u4F53\uFF1A\u89C6\u9891\u6216\u56FE\u7247 */}\n {item.backgroundImage?.isShowVideo ? (\n <>\n {/* \u79FB\u52A8\u7AEF\u89C6\u9891 (<1025px) */}\n {item.backgroundImage?.mobileVideo && (\n <video\n className={cn(\n 'image-text-overlay-card-image',\n 'laptop:hidden absolute inset-0 size-full object-cover',\n classNames?.cardImage\n )}\n src={item.backgroundImage.mobileVideo.url}\n autoPlay\n muted\n loop\n playsInline\n />\n )}\n {/* \u684C\u9762\u7AEF\u89C6\u9891 (>=1025px) */}\n {item.backgroundImage?.desktopVideo && (\n <video\n className={cn(\n 'image-text-overlay-card-image',\n 'laptop:block absolute inset-0 hidden size-full object-cover',\n classNames?.cardImage\n )}\n src={item.backgroundImage.desktopVideo.url}\n autoPlay\n muted\n loop\n playsInline\n />\n )}\n </>\n ) : (\n responsiveSource && (\n <Picture\n source={responsiveSource}\n alt={defaultAlt || item.title}\n className={cn('image-text-overlay-card-image', 'absolute inset-0 size-full', classNames?.cardImage)}\n imgClassName=\"size-full object-cover cursor-pointer transition-all duration-300 group-hover:scale-105\"\n />\n )\n )}\n\n {/* \u6587\u5B57\u5185\u5BB9 */}\n <div\n className={cn(\n 'image-text-overlay-card-content',\n 'relative z-10 flex w-full flex-col gap-1',\n classNames?.cardContent\n )}\n >\n <Heading\n as=\"h4\"\n size={2}\n weight=\"bold\"\n className={cn(\n 'image-text-overlay-card-title text-info-primary line-clamp-1',\n 'w-full leading-[1.2] tracking-[-0.04em]',\n // \u5B57\u53F7: mobile/tablet/laptop 18px, desktop 20px, lg-desktop 24px\n 'desktop:text-xl lg-desktop:text-2xl text-lg',\n classNames?.cardTitle\n )}\n >\n {item.title}\n </Heading>\n\n {item.subtitle && (\n <Text\n as=\"p\"\n size=\"none\"\n weight=\"bold\"\n className={cn(\n 'image-text-overlay-card-subtitle text-info-primary line-clamp-1',\n 'w-full truncate leading-[1.4] tracking-[-0.02em]',\n // \u5B57\u53F7: mobile/tablet/laptop 14px, desktop 14px, lg-desktop 18px (count<=3) or 16px (count>3)\n 'lg-desktop:text-base text-sm',\n count <= 3 && 'lg-desktop:text-lg',\n classNames?.cardSubtitle\n )}\n >\n {item.subtitle}\n </Text>\n )}\n </div>\n </div>\n )\n}\n\n/**\n * ImageTextOverlay - \u56FE\u6587\u53E0\u52A0\u7EC4\u4EF6\n *\n * @description \u4EE5\u80CC\u666F\u56FE\u4E3A\u4E3B\u7684\u5361\u7247\u5E03\u5C40\u7EC4\u4EF6\uFF0C\u6807\u9898\u548C\u526F\u6807\u9898\u53E0\u52A0\u663E\u793A\u5728\u56FE\u7247\u5E95\u90E8\u3002\n * \u652F\u6301 2-6 \u4E2A items \u7684\u81EA\u52A8\u54CD\u5E94\u5F0F\u7F51\u683C\u5E03\u5C40\uFF0C\u6BCF\u4E2A item \u7684 backgroundImage\n * \u652F\u6301 5 \u4E2A\u65AD\u70B9 (default/tablet/laptop/desktop/lgDesktop)\u3002\n *\n * @example\n * ```tsx\n * <ImageTextOverlay\n * data={{\n * items: [\n * {\n * backgroundImage: {\n * default: { url: '/bg-mobile.jpg', alt: 'feature' },\n * tablet: { url: '/bg-tablet.jpg', alt: 'feature' },\n * laptop: { url: '/bg-laptop.jpg', alt: 'feature' },\n * desktop: { url: '/bg-desktop.jpg', alt: 'feature' },\n * lgDesktop: { url: '/bg-xl.jpg', alt: 'feature' },\n * },\n * title: '300+ AI brainwave audios',\n * subtitle: 'Charge in a Flash, Share in a Dash',\n * },\n * {\n * backgroundImage: { default: { url: '/bg2.jpg', alt: '' } },\n * title: '20+ white noise sounds',\n * subtitle: 'Power to Drive Your Prime',\n * },\n * ],\n * theme: 'dark',\n * }}\n * />\n * ```\n */\nconst ImageTextOverlay = forwardRef<HTMLDivElement, ImageTextOverlayProps>(\n ({ data, className, classNames = {}, ...props }, ref) => {\n const boxRef = React.useRef<HTMLDivElement>(null)\n const { items = [] } = data\n const [isMobile, setIsMobile] = useState(false)\n const mediaQuery = useMediaQuery({ query: '(max-width: 767px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\n\n useExposure(boxRef, {\n componentType,\n componentName,\n })\n\n React.useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n if (!items.length) return null\n\n const count = items.length\n const useSwiper = count > 3 && isMobile\n const chunkedItems = chunkArray(items, 3)\n\n return (\n <div\n ref={boxRef}\n className={cn('image-text-overlay-root', className, classNames.root)}\n data-ui-component-id=\"ImageTextOverlay\"\n {...props}\n >\n {useSwiper ? (\n <div className=\"image-text-overlay-mobile-swiper relative pb-8\">\n <Swiper\n className=\"w-full [&_.swiper-slide]:!h-auto [&_.swiper-wrapper]:items-stretch\"\n modules={[Pagination]}\n slidesPerView={1}\n pagination={{\n clickable: true,\n el: `.${MOBILE_SWIPER_PAGINATION_CLASS}`,\n bulletClass: 'image-text-overlay-bullet',\n bulletActiveClass: 'image-text-overlay-bullet-active',\n }}\n spaceBetween={16}\n >\n {chunkedItems.map((group, gIndex) => (\n <SwiperSlide key={gIndex} className=\"!h-auto\">\n <div className=\"flex flex-col gap-4\">\n {group.map((item, index) => (\n <ImageTextOverlayCard\n key={gIndex * 3 + index}\n item={item}\n index={gIndex * 3 + index}\n count={count}\n classNames={classNames}\n />\n ))}\n </div>\n </SwiperSlide>\n ))}\n </Swiper>\n <div className=\"absolute inset-x-0 bottom-0 z-10 flex justify-center\">\n <div\n className={cn(\n MOBILE_SWIPER_PAGINATION_CLASS,\n 'flex items-center justify-center gap-2 text-center',\n '[&_.swiper-pagination-bullet]:m-0',\n '[&_.swiper-pagination-bullet]:shrink-0',\n '[&_.swiper-pagination-bullet]:opacity-100'\n )}\n />\n </div>\n <style>{`\n .image-text-overlay-bullet {\n display: inline-block;\n width: 8px;\n height: 8px;\n border-radius: 9999px;\n background: #767880;\n transition: all 0.3s ease;\n }\n\n .image-text-overlay-bullet-active {\n width: 32px;\n height: 8px;\n border-radius: 9999px;\n background: #080A0F;\n }\n `}</style>\n </div>\n ) : (\n <div className={cn('image-text-overlay-grid', 'grid gap-4', getGridClasses(count), classNames.grid)}>\n {items.map((item, index) => (\n <ImageTextOverlayCard key={index} item={item} index={index} count={count} classNames={classNames} />\n ))}\n </div>\n )}\n </div>\n )\n }\n)\n\nImageTextOverlay.displayName = 'ImageTextOverlay'\n\nexport default withLayout(ImageTextOverlay)\n"],
5
+ "mappings": "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",
6
+ "names": ["Fragment", "jsx", "jsxs", "React", "forwardRef", "useEffect", "useState", "cn", "Heading", "Text", "Picture", "useExposure", "withLayout", "trackUrlRef", "getLocalizedPath", "useAiuiContext", "useMediaQuery", "Swiper", "SwiperSlide", "Pagination", "componentType", "componentName", "imageComponentType", "MOBILE_SWIPER_PAGINATION_CLASS", "BREAKPOINTS", "buildResponsiveSource", "backgroundImage", "sources", "getBackgroundAlt", "chunkArray", "arr", "size", "chunks", "i", "getGridClasses", "count", "getItemSpanClasses", "index", "getAspectRatioClasses", "ImageTextOverlayCard", "item", "classNames", "responsiveSource", "defaultAlt", "spanClasses", "imageRef", "locale", "pageHandle", "localizedLink", "trackedLink", "titleDescButton", "aspectRatioClasses", "ImageTextOverlay", "data", "className", "props", "ref", "boxRef", "items", "isMobile", "setIsMobile", "mediaQuery", "useSwiper", "chunkedItems", "group", "gIndex", "ImageTextOverlay_default"]
7
+ }