@anker-in/headless-ui 1.0.24 → 1.0.26-alpha.1761893017767
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.
- package/dist/cjs/biz-components/FeatureCards/FeatureCards.d.ts +7 -0
- package/dist/cjs/biz-components/FeatureCards/FeatureCards.js +2 -0
- package/dist/cjs/biz-components/FeatureCards/FeatureCards.js.map +7 -0
- package/dist/cjs/biz-components/FeatureCards/index.d.ts +2 -0
- package/dist/cjs/biz-components/FeatureCards/index.js +2 -0
- package/dist/cjs/biz-components/FeatureCards/index.js.map +7 -0
- package/dist/cjs/biz-components/FeatureCards/types.d.ts +25 -0
- package/dist/cjs/biz-components/FeatureCards/types.js +2 -0
- package/dist/cjs/biz-components/FeatureCards/types.js.map +7 -0
- package/dist/cjs/biz-components/FeatureShowcase/FeatureShowcase.d.ts +7 -0
- package/dist/cjs/biz-components/FeatureShowcase/FeatureShowcase.js +2 -0
- package/dist/cjs/biz-components/FeatureShowcase/FeatureShowcase.js.map +7 -0
- package/dist/cjs/biz-components/FeatureShowcase/index.d.ts +2 -0
- package/dist/cjs/biz-components/FeatureShowcase/index.js +2 -0
- package/dist/cjs/biz-components/FeatureShowcase/index.js.map +7 -0
- package/dist/cjs/biz-components/FeatureShowcase/types.d.ts +20 -0
- package/dist/cjs/biz-components/FeatureShowcase/types.js +2 -0
- package/dist/cjs/biz-components/FeatureShowcase/types.js.map +7 -0
- package/dist/cjs/biz-components/FooterNavigation/index.js +1 -1
- package/dist/cjs/biz-components/FooterNavigation/index.js.map +2 -2
- package/dist/cjs/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/index.js.map +2 -2
- package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.d.ts +7 -0
- package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.js +2 -0
- package/dist/cjs/biz-components/ImageTextFeature/ImageTextFeature.js.map +7 -0
- package/dist/cjs/biz-components/ImageTextFeature/index.d.ts +2 -0
- package/dist/cjs/biz-components/ImageTextFeature/index.js +2 -0
- package/dist/cjs/biz-components/ImageTextFeature/index.js.map +7 -0
- package/dist/cjs/biz-components/ImageTextFeature/types.d.ts +31 -0
- package/dist/cjs/biz-components/ImageTextFeature/types.js +2 -0
- package/dist/cjs/biz-components/ImageTextFeature/types.js.map +7 -0
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.d.ts +7 -0
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.js +2 -0
- package/dist/cjs/biz-components/ImageWithText/ImageWithText.js.map +7 -0
- package/dist/cjs/biz-components/ImageWithText/index.d.ts +2 -0
- package/dist/cjs/biz-components/ImageWithText/index.js +2 -0
- package/dist/cjs/biz-components/ImageWithText/index.js.map +7 -0
- package/dist/cjs/biz-components/ImageWithText/types.d.ts +23 -0
- package/dist/cjs/biz-components/ImageWithText/types.js +2 -0
- package/dist/cjs/biz-components/ImageWithText/types.js.map +7 -0
- package/dist/cjs/biz-components/Ksp/index.d.ts +40 -0
- package/dist/cjs/biz-components/Ksp/index.js +2 -0
- package/dist/cjs/biz-components/Ksp/index.js.map +7 -0
- package/dist/cjs/biz-components/MarqueeReview/index.d.ts +41 -0
- package/dist/cjs/biz-components/MarqueeReview/index.js +25 -0
- package/dist/cjs/biz-components/MarqueeReview/index.js.map +7 -0
- package/dist/cjs/biz-components/ProductCompare/index.d.ts +37 -0
- package/dist/cjs/biz-components/ProductCompare/index.js +2 -0
- package/dist/cjs/biz-components/ProductCompare/index.js.map +7 -0
- package/dist/cjs/biz-components/ProductHero/ProductHero.d.ts +7 -0
- package/dist/cjs/biz-components/ProductHero/ProductHero.js +2 -0
- package/dist/cjs/biz-components/ProductHero/ProductHero.js.map +7 -0
- package/dist/cjs/biz-components/ProductHero/index.d.ts +2 -0
- package/dist/cjs/biz-components/ProductHero/index.js +2 -0
- package/dist/cjs/biz-components/ProductHero/index.js.map +7 -0
- package/dist/cjs/biz-components/ProductHero/types.d.ts +20 -0
- package/dist/cjs/biz-components/ProductHero/types.js +2 -0
- package/dist/cjs/biz-components/ProductHero/types.js.map +7 -0
- package/dist/cjs/biz-components/Specs/dropdown.d.ts +11 -0
- package/dist/cjs/biz-components/Specs/dropdown.js +3 -0
- package/dist/cjs/biz-components/Specs/dropdown.js.map +7 -0
- package/dist/cjs/biz-components/Specs/index.d.ts +6 -0
- package/dist/cjs/biz-components/Specs/index.js +2 -0
- package/dist/cjs/biz-components/Specs/index.js.map +7 -0
- package/dist/cjs/biz-components/SpecsComparison/SpecsComparison.d.ts +7 -0
- package/dist/cjs/biz-components/SpecsComparison/SpecsComparison.js +2 -0
- package/dist/cjs/biz-components/SpecsComparison/SpecsComparison.js.map +7 -0
- package/dist/cjs/biz-components/SpecsComparison/index.d.ts +2 -0
- package/dist/cjs/biz-components/SpecsComparison/index.js +2 -0
- package/dist/cjs/biz-components/SpecsComparison/index.js.map +7 -0
- package/dist/cjs/biz-components/SpecsComparison/types.d.ts +34 -0
- package/dist/cjs/biz-components/SpecsComparison/types.js +2 -0
- package/dist/cjs/biz-components/SpecsComparison/types.js.map +7 -0
- package/dist/cjs/biz-components/TabWithImage/TabWithImage.d.ts +7 -0
- package/dist/cjs/biz-components/TabWithImage/TabWithImage.js +2 -0
- package/dist/cjs/biz-components/TabWithImage/TabWithImage.js.map +7 -0
- package/dist/cjs/biz-components/TabWithImage/index.d.ts +2 -0
- package/dist/cjs/biz-components/TabWithImage/index.js +2 -0
- package/dist/cjs/biz-components/TabWithImage/index.js.map +7 -0
- package/dist/cjs/biz-components/TabWithImage/types.d.ts +28 -0
- package/dist/cjs/biz-components/TabWithImage/types.js +2 -0
- package/dist/cjs/biz-components/TabWithImage/types.js.map +7 -0
- package/dist/cjs/biz-components/TabsGroup/index.d.ts +7 -0
- package/dist/cjs/biz-components/TabsGroup/index.js +2 -0
- package/dist/cjs/biz-components/TabsGroup/index.js.map +7 -0
- package/dist/cjs/biz-components/TabsGroup/types.d.ts +16 -0
- package/dist/cjs/biz-components/TabsGroup/types.js +2 -0
- package/dist/cjs/biz-components/TabsGroup/types.js.map +7 -0
- package/dist/cjs/biz-components/TabsWithMedia/TabsWithMedia.d.ts +7 -0
- package/dist/cjs/biz-components/TabsWithMedia/TabsWithMedia.js +2 -0
- package/dist/cjs/biz-components/TabsWithMedia/TabsWithMedia.js.map +7 -0
- package/dist/cjs/biz-components/TabsWithMedia/index.d.ts +2 -0
- package/dist/cjs/biz-components/TabsWithMedia/index.js +2 -0
- package/dist/cjs/biz-components/TabsWithMedia/index.js.map +7 -0
- package/dist/cjs/biz-components/TabsWithMedia/types.d.ts +40 -0
- package/dist/cjs/biz-components/TabsWithMedia/types.js +2 -0
- package/dist/cjs/biz-components/TabsWithMedia/types.js.map +7 -0
- package/dist/cjs/biz-components/VideoFeature/VideoFeature.d.ts +7 -0
- package/dist/cjs/biz-components/VideoFeature/VideoFeature.js +2 -0
- package/dist/cjs/biz-components/VideoFeature/VideoFeature.js.map +7 -0
- package/dist/cjs/biz-components/VideoFeature/index.d.ts +2 -0
- package/dist/cjs/biz-components/VideoFeature/index.js +2 -0
- package/dist/cjs/biz-components/VideoFeature/index.js.map +7 -0
- package/dist/cjs/biz-components/VideoFeature/types.d.ts +18 -0
- package/dist/cjs/biz-components/VideoFeature/types.js +2 -0
- package/dist/cjs/biz-components/VideoFeature/types.js.map +7 -0
- package/dist/cjs/biz-components/index.d.ts +61 -0
- package/dist/cjs/biz-components/index.js +1 -1
- package/dist/cjs/biz-components/index.js.map +3 -3
- package/dist/cjs/cpn-components/CpnNavigation/index.js +1 -1
- package/dist/cjs/cpn-components/CpnNavigation/index.js.map +3 -3
- package/dist/cjs/shared/Styles.js +1 -1
- package/dist/cjs/shared/Styles.js.map +3 -3
- package/dist/cjs/stories/MarqueeReview.stories.d.ts +73 -0
- package/dist/cjs/stories/MarqueeReview.stories.js +19 -0
- package/dist/cjs/stories/MarqueeReview.stories.js.map +7 -0
- package/dist/cjs/stories/featureCards.stories.d.ts +28 -0
- package/dist/cjs/stories/featureCards.stories.js +2 -0
- package/dist/cjs/stories/featureCards.stories.js.map +7 -0
- package/dist/cjs/stories/featureShowcase.stories.d.ts +28 -0
- package/dist/cjs/stories/featureShowcase.stories.js +2 -0
- package/dist/cjs/stories/featureShowcase.stories.js.map +7 -0
- package/dist/cjs/stories/imageTextFeature.stories.d.ts +27 -0
- package/dist/cjs/stories/imageTextFeature.stories.js +2 -0
- package/dist/cjs/stories/imageTextFeature.stories.js.map +7 -0
- package/dist/cjs/stories/imageWithText.stories.d.ts +27 -0
- package/dist/cjs/stories/imageWithText.stories.js +2 -0
- package/dist/cjs/stories/imageWithText.stories.js.map +7 -0
- package/dist/cjs/stories/ksp.stories.d.ts +63 -0
- package/dist/cjs/stories/ksp.stories.js +129 -0
- package/dist/cjs/stories/ksp.stories.js.map +7 -0
- package/dist/cjs/stories/productCompare.stories.d.ts +49 -0
- package/dist/cjs/stories/productCompare.stories.js +63 -0
- package/dist/cjs/stories/productCompare.stories.js.map +7 -0
- package/dist/cjs/stories/productHero.stories.d.ts +28 -0
- package/dist/cjs/stories/productHero.stories.js +2 -0
- package/dist/cjs/stories/productHero.stories.js.map +7 -0
- package/dist/cjs/stories/specs.stories.d.ts +13 -0
- package/dist/cjs/stories/specs.stories.js +57 -0
- package/dist/cjs/stories/specs.stories.js.map +7 -0
- package/dist/cjs/stories/specsComparison.stories.d.ts +27 -0
- package/dist/cjs/stories/specsComparison.stories.js +30 -0
- package/dist/cjs/stories/specsComparison.stories.js.map +7 -0
- package/dist/cjs/stories/tabWithImage.stories.d.ts +27 -0
- package/dist/cjs/stories/tabWithImage.stories.js +2 -0
- package/dist/cjs/stories/tabWithImage.stories.js.map +7 -0
- package/dist/cjs/stories/tabsWithMedia.stories.d.ts +27 -0
- package/dist/cjs/stories/tabsWithMedia.stories.js +2 -0
- package/dist/cjs/stories/tabsWithMedia.stories.js.map +7 -0
- package/dist/cjs/stories/videoFeature.stories.d.ts +28 -0
- package/dist/cjs/stories/videoFeature.stories.js +2 -0
- package/dist/cjs/stories/videoFeature.stories.js.map +7 -0
- package/dist/cjs/types/props.d.ts +4 -0
- package/dist/cjs/types/props.js +1 -1
- package/dist/cjs/types/props.js.map +1 -1
- package/dist/esm/biz-components/FeatureCards/FeatureCards.d.ts +7 -0
- package/dist/esm/biz-components/FeatureCards/FeatureCards.js +2 -0
- package/dist/esm/biz-components/FeatureCards/FeatureCards.js.map +7 -0
- package/dist/esm/biz-components/FeatureCards/index.d.ts +2 -0
- package/dist/esm/biz-components/FeatureCards/index.js +2 -0
- package/dist/esm/biz-components/FeatureCards/index.js.map +7 -0
- package/dist/esm/biz-components/FeatureCards/types.d.ts +25 -0
- package/dist/esm/biz-components/FeatureCards/types.js +1 -0
- package/dist/esm/biz-components/FeatureCards/types.js.map +7 -0
- package/dist/esm/biz-components/FeatureShowcase/FeatureShowcase.d.ts +7 -0
- package/dist/esm/biz-components/FeatureShowcase/FeatureShowcase.js +2 -0
- package/dist/esm/biz-components/FeatureShowcase/FeatureShowcase.js.map +7 -0
- package/dist/esm/biz-components/FeatureShowcase/index.d.ts +2 -0
- package/dist/esm/biz-components/FeatureShowcase/index.js +2 -0
- package/dist/esm/biz-components/FeatureShowcase/index.js.map +7 -0
- package/dist/esm/biz-components/FeatureShowcase/types.d.ts +20 -0
- package/dist/esm/biz-components/FeatureShowcase/types.js +1 -0
- package/dist/esm/biz-components/FeatureShowcase/types.js.map +7 -0
- package/dist/esm/biz-components/FooterNavigation/index.js +1 -1
- package/dist/esm/biz-components/FooterNavigation/index.js.map +2 -2
- package/dist/esm/biz-components/HeaderNavigation/index.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/index.js.map +2 -2
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.d.ts +7 -0
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.js +2 -0
- package/dist/esm/biz-components/ImageTextFeature/ImageTextFeature.js.map +7 -0
- package/dist/esm/biz-components/ImageTextFeature/index.d.ts +2 -0
- package/dist/esm/biz-components/ImageTextFeature/index.js +2 -0
- package/dist/esm/biz-components/ImageTextFeature/index.js.map +7 -0
- package/dist/esm/biz-components/ImageTextFeature/types.d.ts +31 -0
- package/dist/esm/biz-components/ImageTextFeature/types.js +1 -0
- package/dist/esm/biz-components/ImageTextFeature/types.js.map +7 -0
- package/dist/esm/biz-components/ImageWithText/ImageWithText.d.ts +7 -0
- package/dist/esm/biz-components/ImageWithText/ImageWithText.js +2 -0
- package/dist/esm/biz-components/ImageWithText/ImageWithText.js.map +7 -0
- package/dist/esm/biz-components/ImageWithText/index.d.ts +2 -0
- package/dist/esm/biz-components/ImageWithText/index.js +2 -0
- package/dist/esm/biz-components/ImageWithText/index.js.map +7 -0
- package/dist/esm/biz-components/ImageWithText/types.d.ts +23 -0
- package/dist/esm/biz-components/ImageWithText/types.js +1 -0
- package/dist/esm/biz-components/ImageWithText/types.js.map +7 -0
- package/dist/esm/biz-components/Ksp/index.d.ts +40 -0
- package/dist/esm/biz-components/Ksp/index.js +2 -0
- package/dist/esm/biz-components/Ksp/index.js.map +7 -0
- package/dist/esm/biz-components/MarqueeReview/index.d.ts +41 -0
- package/dist/esm/biz-components/MarqueeReview/index.js +25 -0
- package/dist/esm/biz-components/MarqueeReview/index.js.map +7 -0
- package/dist/esm/biz-components/ProductCompare/index.d.ts +37 -0
- package/dist/esm/biz-components/ProductCompare/index.js +2 -0
- package/dist/esm/biz-components/ProductCompare/index.js.map +7 -0
- package/dist/esm/biz-components/ProductHero/ProductHero.d.ts +7 -0
- package/dist/esm/biz-components/ProductHero/ProductHero.js +2 -0
- package/dist/esm/biz-components/ProductHero/ProductHero.js.map +7 -0
- package/dist/esm/biz-components/ProductHero/index.d.ts +2 -0
- package/dist/esm/biz-components/ProductHero/index.js +2 -0
- package/dist/esm/biz-components/ProductHero/index.js.map +7 -0
- package/dist/esm/biz-components/ProductHero/types.d.ts +20 -0
- package/dist/esm/biz-components/ProductHero/types.js +1 -0
- package/dist/esm/biz-components/ProductHero/types.js.map +7 -0
- package/dist/esm/biz-components/Specs/dropdown.d.ts +11 -0
- package/dist/esm/biz-components/Specs/dropdown.js +3 -0
- package/dist/esm/biz-components/Specs/dropdown.js.map +7 -0
- package/dist/esm/biz-components/Specs/index.d.ts +6 -0
- package/dist/esm/biz-components/Specs/index.js +2 -0
- package/dist/esm/biz-components/Specs/index.js.map +7 -0
- package/dist/esm/biz-components/SpecsComparison/SpecsComparison.d.ts +7 -0
- package/dist/esm/biz-components/SpecsComparison/SpecsComparison.js +2 -0
- package/dist/esm/biz-components/SpecsComparison/SpecsComparison.js.map +7 -0
- package/dist/esm/biz-components/SpecsComparison/index.d.ts +2 -0
- package/dist/esm/biz-components/SpecsComparison/index.js +2 -0
- package/dist/esm/biz-components/SpecsComparison/index.js.map +7 -0
- package/dist/esm/biz-components/SpecsComparison/types.d.ts +34 -0
- package/dist/esm/biz-components/SpecsComparison/types.js +1 -0
- package/dist/esm/biz-components/SpecsComparison/types.js.map +7 -0
- package/dist/esm/biz-components/TabWithImage/TabWithImage.d.ts +7 -0
- package/dist/esm/biz-components/TabWithImage/TabWithImage.js +2 -0
- package/dist/esm/biz-components/TabWithImage/TabWithImage.js.map +7 -0
- package/dist/esm/biz-components/TabWithImage/index.d.ts +2 -0
- package/dist/esm/biz-components/TabWithImage/index.js +2 -0
- package/dist/esm/biz-components/TabWithImage/index.js.map +7 -0
- package/dist/esm/biz-components/TabWithImage/types.d.ts +28 -0
- package/dist/esm/biz-components/TabWithImage/types.js +1 -0
- package/dist/esm/biz-components/TabWithImage/types.js.map +7 -0
- package/dist/esm/biz-components/TabsGroup/index.d.ts +7 -0
- package/dist/esm/biz-components/TabsGroup/index.js +2 -0
- package/dist/esm/biz-components/TabsGroup/index.js.map +7 -0
- package/dist/esm/biz-components/TabsGroup/types.d.ts +16 -0
- package/dist/esm/biz-components/TabsGroup/types.js +1 -0
- package/dist/esm/biz-components/TabsGroup/types.js.map +7 -0
- package/dist/esm/biz-components/TabsWithMedia/TabsWithMedia.d.ts +7 -0
- package/dist/esm/biz-components/TabsWithMedia/TabsWithMedia.js +2 -0
- package/dist/esm/biz-components/TabsWithMedia/TabsWithMedia.js.map +7 -0
- package/dist/esm/biz-components/TabsWithMedia/index.d.ts +2 -0
- package/dist/esm/biz-components/TabsWithMedia/index.js +2 -0
- package/dist/esm/biz-components/TabsWithMedia/index.js.map +7 -0
- package/dist/esm/biz-components/TabsWithMedia/types.d.ts +40 -0
- package/dist/esm/biz-components/TabsWithMedia/types.js +1 -0
- package/dist/esm/biz-components/TabsWithMedia/types.js.map +7 -0
- package/dist/esm/biz-components/VideoFeature/VideoFeature.d.ts +7 -0
- package/dist/esm/biz-components/VideoFeature/VideoFeature.js +2 -0
- package/dist/esm/biz-components/VideoFeature/VideoFeature.js.map +7 -0
- package/dist/esm/biz-components/VideoFeature/index.d.ts +2 -0
- package/dist/esm/biz-components/VideoFeature/index.js +2 -0
- package/dist/esm/biz-components/VideoFeature/index.js.map +7 -0
- package/dist/esm/biz-components/VideoFeature/types.d.ts +18 -0
- package/dist/esm/biz-components/VideoFeature/types.js +1 -0
- package/dist/esm/biz-components/VideoFeature/types.js.map +7 -0
- package/dist/esm/biz-components/index.d.ts +61 -0
- package/dist/esm/biz-components/index.js +1 -1
- package/dist/esm/biz-components/index.js.map +3 -3
- package/dist/esm/cpn-components/CpnNavigation/index.js +1 -1
- package/dist/esm/cpn-components/CpnNavigation/index.js.map +2 -2
- package/dist/esm/shared/Styles.js +1 -1
- package/dist/esm/shared/Styles.js.map +3 -3
- package/dist/esm/stories/MarqueeReview.stories.d.ts +73 -0
- package/dist/esm/stories/MarqueeReview.stories.js +19 -0
- package/dist/esm/stories/MarqueeReview.stories.js.map +7 -0
- package/dist/esm/stories/featureCards.stories.d.ts +28 -0
- package/dist/esm/stories/featureCards.stories.js +2 -0
- package/dist/esm/stories/featureCards.stories.js.map +7 -0
- package/dist/esm/stories/featureShowcase.stories.d.ts +28 -0
- package/dist/esm/stories/featureShowcase.stories.js +2 -0
- package/dist/esm/stories/featureShowcase.stories.js.map +7 -0
- package/dist/esm/stories/imageTextFeature.stories.d.ts +27 -0
- package/dist/esm/stories/imageTextFeature.stories.js +2 -0
- package/dist/esm/stories/imageTextFeature.stories.js.map +7 -0
- package/dist/esm/stories/imageWithText.stories.d.ts +27 -0
- package/dist/esm/stories/imageWithText.stories.js +2 -0
- package/dist/esm/stories/imageWithText.stories.js.map +7 -0
- package/dist/esm/stories/ksp.stories.d.ts +63 -0
- package/dist/esm/stories/ksp.stories.js +129 -0
- package/dist/esm/stories/ksp.stories.js.map +7 -0
- package/dist/esm/stories/productCompare.stories.d.ts +49 -0
- package/dist/esm/stories/productCompare.stories.js +63 -0
- package/dist/esm/stories/productCompare.stories.js.map +7 -0
- package/dist/esm/stories/productHero.stories.d.ts +28 -0
- package/dist/esm/stories/productHero.stories.js +2 -0
- package/dist/esm/stories/productHero.stories.js.map +7 -0
- package/dist/esm/stories/specs.stories.d.ts +13 -0
- package/dist/esm/stories/specs.stories.js +57 -0
- package/dist/esm/stories/specs.stories.js.map +7 -0
- package/dist/esm/stories/specsComparison.stories.d.ts +27 -0
- package/dist/esm/stories/specsComparison.stories.js +30 -0
- package/dist/esm/stories/specsComparison.stories.js.map +7 -0
- package/dist/esm/stories/tabWithImage.stories.d.ts +27 -0
- package/dist/esm/stories/tabWithImage.stories.js +2 -0
- package/dist/esm/stories/tabWithImage.stories.js.map +7 -0
- package/dist/esm/stories/tabsWithMedia.stories.d.ts +27 -0
- package/dist/esm/stories/tabsWithMedia.stories.js +2 -0
- package/dist/esm/stories/tabsWithMedia.stories.js.map +7 -0
- package/dist/esm/stories/videoFeature.stories.d.ts +28 -0
- package/dist/esm/stories/videoFeature.stories.js +2 -0
- package/dist/esm/stories/videoFeature.stories.js.map +7 -0
- package/dist/esm/types/props.d.ts +4 -0
- package/dist/tokens/base.css +3 -0
- package/package.json +4 -1
- package/tailwind.config.js +2 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { FeatureCardsProps } from './types.js';
|
|
3
|
+
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<FeatureCardsProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
+
className?: string;
|
|
5
|
+
data?: Record<string, any>;
|
|
6
|
+
}, "ref"> & React.RefAttributes<any>>;
|
|
7
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";"use client";var C=Object.create;var x=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty;var $=(p,a)=>{for(var s in a)x(p,s,{get:a[s],enumerable:!0})},k=(p,a,s,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let o of T(a))!H.call(p,o)&&o!==s&&x(p,o,{get:()=>a[o],enumerable:!(i=F(a,o))||i.enumerable});return p};var R=(p,a,s)=>(s=p!=null?C(z(p)):{},k(a||!p||!p.__esModule?x(s,"default",{value:p,enumerable:!0}):s,p)),S=p=>k(x({},"__esModule",{value:!0}),p);var D={};$(D,{default:()=>j});module.exports=S(D);var e=require("react/jsx-runtime"),r=R(require("react")),l=require("../../components/index.js"),d=require("../../helpers/utils.js"),N=require("../../shared/Styles.js"),y=require("../../hooks/useExposure.js"),w=require("../../shared/trackUrlRef.js"),n=require("swiper/react");const m="image",u="feature_cards",g=r.default.forwardRef(({data:p,className:a},s)=>{const{title:i,subtitle:o,items:f=[]}=p,c=(0,r.useRef)(null);(0,y.useExposure)(c,{componentType:m,componentName:u,componentTitle:i,componentDescription:o}),(0,r.useImperativeHandle)(s,()=>c.current);const b=t=>{const h=(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Picture,{source:t.imageUrl,alt:t.title,className:"absolute inset-0 !h-full",imgClassName:"!h-full object-cover"}),(0,e.jsxs)("div",{className:"z-10",children:[(0,e.jsx)(l.Heading,{size:3,as:"h2",className:"laptop:text-[20px] desktop:text-[32px] lg-desktop:text-[32px]",children:t.title}),(0,e.jsx)(l.Text,{size:4,as:"p",className:"mt-[4px] line-clamp-2 h-[40px] text-[14px] laptop:h-[44px] lg-desktop:text-[18px]",children:t.subtitle})]})]}),v=(0,d.cn)("relative flex h-[360px] max-h-[560px] flex-1 flex-col justify-end gap-[16px] overflow-hidden rounded-[12px] px-[16px] py-[12px] text-info-primary tablet:h-[336px] laptop:h-[336px] laptop:px-[16px] laptop:py-[16px] desktop:h-[448px] desktop:rounded-[16px] desktop:px-[32px] desktop:py-[24px] lg-desktop:h-[560px]",{"aiui-dark":t.theme==="dark","aiui-light":t.theme==="light"});return t.link?(0,e.jsx)("a",{href:(0,w.trackUrlRef)(t.link,`${m}_${u}`),className:v,"data-headless-type-name":`${m}#${u}`,"data-headless-title-desc-button":`${i}#${t.title}#${t.subtitle}`,children:h}):(0,e.jsx)("div",{className:v,children:h})};return(0,e.jsxs)("section",{ref:c,"data-ui-component-id":"FeatureCards",className:(0,d.cn)("flex w-full flex-col justify-center",a),children:[(0,e.jsx)(l.Heading,{size:4,as:"h1",className:"text-left laptop:text-center",children:i}),o&&(0,e.jsx)(l.Text,{size:2,as:"p",className:"mt-[4px] text-left text-[14px] laptop:text-center desktop:text-[16px] lg-desktop:text-[18px]",children:o}),(0,e.jsx)("div",{className:"mt-[24px] hidden w-full gap-[16px] laptop:mt-[32px] laptop:flex desktop:mt-[40px] lg-desktop:mt-[24px]",children:f.map(t=>(0,e.jsx)(r.default.Fragment,{children:b(t)},t.title))}),(0,e.jsx)("div",{className:"mt-[24px] w-full laptop:hidden",children:(0,e.jsx)(n.Swiper,{spaceBetween:12,slidesPerView:"auto",grabCursor:!0,className:"relative w-full !overflow-visible",children:f.map(t=>(0,e.jsx)(n.SwiperSlide,{className:"relative !h-[360px] !w-[296px]",children:(0,e.jsxs)("div",{className:(0,d.cn)("absolute inset-0 flex flex-1 flex-col justify-end gap-[16px] overflow-hidden rounded-[12px] px-[16px] py-[12px] text-info-primary laptop:px-[16px] laptop:py-[16px] desktop:rounded-[16px] desktop:px-[32px] desktop:py-[24px]",{"aiui-dark":t.theme==="dark","aiui-light":t.theme==="light"}),children:[(0,e.jsx)(l.Picture,{source:t.imageUrl,alt:t.title,className:"absolute inset-0 !h-full",imgClassName:"!h-full object-cover"}),(0,e.jsxs)("div",{className:"z-10",children:[(0,e.jsx)(l.Heading,{size:3,as:"h2",children:t.title}),(0,e.jsx)(l.Text,{size:4,as:"p",className:"mt-[4px] line-clamp-2 h-[40px] overflow-visible text-[14px] laptop:h-[50px] lg-desktop:text-[18px]",children:t.subtitle})]})]},t.title)},t.title))})})]})});g.displayName="FeatureCards";var j=(0,N.withLayout)(g);
|
|
2
|
+
//# sourceMappingURL=FeatureCards.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/biz-components/FeatureCards/FeatureCards.tsx"],
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useImperativeHandle, useRef } from 'react'\nimport { Heading, Picture, Text } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport type { FeatureCardsProps, FeatureCardItem } from './types.js'\nimport { Swiper, SwiperSlide } from 'swiper/react'\n\nconst componentType = 'image'\nconst componentName = 'feature_cards'\n\nconst FeatureCards = React.forwardRef<HTMLDivElement, FeatureCardsProps>(({ data, className }, ref) => {\n const { title, subtitle, items = [] } = data\n\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 const renderCard = (item: FeatureCardItem) => {\n const cardContent = (\n <>\n <Picture\n source={item.imageUrl}\n alt={item.title}\n className=\"absolute inset-0 !h-full\"\n imgClassName=\"!h-full object-cover\"\n />\n <div className=\"z-10\">\n <Heading size={3} as=\"h2\" className=\"laptop:text-[20px] desktop:text-[32px] lg-desktop:text-[32px]\">\n {item.title}\n </Heading>\n <Text\n size={4}\n as=\"p\"\n className=\"mt-[4px] line-clamp-2 h-[40px] text-[14px] laptop:h-[44px] lg-desktop:text-[18px]\"\n >\n {item.subtitle}\n </Text>\n </div>\n </>\n )\n\n const cardClasses = cn(\n 'relative flex h-[360px] max-h-[560px] flex-1 flex-col justify-end gap-[16px] overflow-hidden rounded-[12px] px-[16px] py-[12px] text-info-primary tablet:h-[336px] laptop:h-[336px] laptop:px-[16px] laptop:py-[16px] desktop:h-[448px] desktop:rounded-[16px] desktop:px-[32px] desktop:py-[24px] lg-desktop:h-[560px]',\n {\n 'aiui-dark': item.theme === 'dark',\n 'aiui-light': item.theme === 'light',\n }\n )\n\n if (item.link) {\n return (\n <a\n href={trackUrlRef(item.link, `${componentType}_${componentName}`)}\n className={cardClasses}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${title}#${item.title}#${item.subtitle}`}\n >\n {cardContent}\n </a>\n )\n }\n\n return <div className={cardClasses}>{cardContent}</div>\n }\n\n return (\n <section\n ref={boxRef}\n data-ui-component-id=\"FeatureCards\"\n className={cn('flex w-full flex-col justify-center', className)}\n >\n {/* \u6807\u9898\u533A\u57DF */}\n <Heading size={4} as=\"h1\" className=\"text-left laptop:text-center\">\n {title}\n </Heading>\n {subtitle && (\n <Text\n size={2}\n as=\"p\"\n className=\"mt-[4px] text-left text-[14px] laptop:text-center desktop:text-[16px] lg-desktop:text-[18px]\"\n >\n {subtitle}\n </Text>\n )}\n\n {/* \u684C\u9762\u7AEF\u7F51\u683C\u5E03\u5C40 */}\n <div className=\"mt-[24px] hidden w-full gap-[16px] laptop:mt-[32px] laptop:flex desktop:mt-[40px] lg-desktop:mt-[24px]\">\n {items.map(item => (\n <React.Fragment key={item.title}>{renderCard(item)}</React.Fragment>\n ))}\n </div>\n\n {/* \u79FB\u52A8\u7AEF Swiper \u5E03\u5C40 */}\n <div className=\"mt-[24px] w-full laptop:hidden\">\n <Swiper spaceBetween={12} slidesPerView=\"auto\" grabCursor className=\"relative w-full !overflow-visible\">\n {items.map(item => (\n <SwiperSlide key={item.title} className=\"relative !h-[360px] !w-[296px]\">\n <div\n key={item.title}\n className={cn(\n 'absolute inset-0 flex flex-1 flex-col justify-end gap-[16px] overflow-hidden rounded-[12px] px-[16px] py-[12px] text-info-primary laptop:px-[16px] laptop:py-[16px] desktop:rounded-[16px] desktop:px-[32px] desktop:py-[24px]',\n {\n 'aiui-dark': item.theme === 'dark',\n 'aiui-light': item.theme === 'light',\n }\n )}\n >\n <Picture\n source={item.imageUrl}\n alt={item.title}\n className=\"absolute inset-0 !h-full\"\n imgClassName=\"!h-full object-cover\"\n />\n <div className=\"z-10\">\n <Heading size={3} as=\"h2\">\n {item.title}\n </Heading>\n <Text\n size={4}\n as=\"p\"\n className=\"mt-[4px] line-clamp-2 h-[40px] overflow-visible text-[14px] laptop:h-[50px] lg-desktop:text-[18px]\"\n >\n {item.subtitle}\n </Text>\n </div>\n </div>\n </SwiperSlide>\n ))}\n </Swiper>\n </div>\n </section>\n )\n})\n\nFeatureCards.displayName = 'FeatureCards'\n\nexport default withLayout(FeatureCards)\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GA6BM,IAAAI,EAAA,6BA5BNC,EAAmD,oBACnDC,EAAuC,qCACvCC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAA4B,sCAC5BC,EAA4B,uCAE5BL,EAAoC,wBAEpC,MAAMM,EAAgB,QAChBC,EAAgB,gBAEhBC,EAAe,EAAAC,QAAM,WAA8C,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CACrG,KAAM,CAAE,MAAAC,EAAO,SAAAC,EAAU,MAAAC,EAAQ,CAAC,CAAE,EAAIL,EAElCM,KAAS,UAAuB,IAAI,KAE1C,eAAYA,EAAQ,CAClB,cAAAV,EACA,cAAAC,EACA,eAAgBM,EAChB,qBAAsBC,CACxB,CAAC,KAED,uBAAoBF,EAAK,IAAMI,EAAO,OAAyB,EAE/D,MAAMC,EAAcC,GAA0B,CAC5C,MAAMC,KACJ,oBACE,oBAAC,WACC,OAAQD,EAAK,SACb,IAAKA,EAAK,MACV,UAAU,2BACV,aAAa,uBACf,KACA,QAAC,OAAI,UAAU,OACb,oBAAC,WAAQ,KAAM,EAAG,GAAG,KAAK,UAAU,gEACjC,SAAAA,EAAK,MACR,KACA,OAAC,QACC,KAAM,EACN,GAAG,IACH,UAAU,oFAET,SAAAA,EAAK,SACR,GACF,GACF,EAGIE,KAAc,MAClB,0TACA,CACE,YAAaF,EAAK,QAAU,OAC5B,aAAcA,EAAK,QAAU,OAC/B,CACF,EAEA,OAAIA,EAAK,QAEL,OAAC,KACC,QAAM,eAAYA,EAAK,KAAM,GAAGZ,CAAa,IAAIC,CAAa,EAAE,EAChE,UAAWa,EACX,0BAAyB,GAAGd,CAAa,IAAIC,CAAa,GAC1D,kCAAiC,GAAGM,CAAK,IAAIK,EAAK,KAAK,IAAIA,EAAK,QAAQ,GAEvE,SAAAC,EACH,KAIG,OAAC,OAAI,UAAWC,EAAc,SAAAD,EAAY,CACnD,EAEA,SACE,QAAC,WACC,IAAKH,EACL,uBAAqB,eACrB,aAAW,MAAG,sCAAuCL,CAAS,EAG9D,oBAAC,WAAQ,KAAM,EAAG,GAAG,KAAK,UAAU,+BACjC,SAAAE,EACH,EACCC,MACC,OAAC,QACC,KAAM,EACN,GAAG,IACH,UAAU,+FAET,SAAAA,EACH,KAIF,OAAC,OAAI,UAAU,yGACZ,SAAAC,EAAM,IAAIG,MACT,OAAC,EAAAT,QAAM,SAAN,CAAiC,SAAAQ,EAAWC,CAAI,GAA5BA,EAAK,KAAyB,CACpD,EACH,KAGA,OAAC,OAAI,UAAU,iCACb,mBAAC,UAAO,aAAc,GAAI,cAAc,OAAO,WAAU,GAAC,UAAU,oCACjE,SAAAH,EAAM,IAAIG,MACT,OAAC,eAA6B,UAAU,iCACtC,oBAAC,OAEC,aAAW,MACT,iOACA,CACE,YAAaA,EAAK,QAAU,OAC5B,aAAcA,EAAK,QAAU,OAC/B,CACF,EAEA,oBAAC,WACC,OAAQA,EAAK,SACb,IAAKA,EAAK,MACV,UAAU,2BACV,aAAa,uBACf,KACA,QAAC,OAAI,UAAU,OACb,oBAAC,WAAQ,KAAM,EAAG,GAAG,KAClB,SAAAA,EAAK,MACR,KACA,OAAC,QACC,KAAM,EACN,GAAG,IACH,UAAU,qGAET,SAAAA,EAAK,SACR,GACF,IA1BKA,EAAK,KA2BZ,GA7BgBA,EAAK,KA8BvB,CACD,EACH,EACF,GACF,CAEJ,CAAC,EAEDV,EAAa,YAAc,eAE3B,IAAOX,KAAQ,cAAWW,CAAY",
|
|
6
|
+
"names": ["FeatureCards_exports", "__export", "FeatureCards_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_Styles", "import_useExposure", "import_trackUrlRef", "componentType", "componentName", "FeatureCards", "React", "data", "className", "ref", "title", "subtitle", "items", "boxRef", "renderCard", "item", "cardContent", "cardClasses"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var f=Object.create;var o=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var C=(e,r)=>{for(var t in r)o(e,t,{get:r[t],enumerable:!0})},s=(e,r,t,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let a of u(r))!y.call(e,a)&&a!==t&&o(e,a,{get:()=>r[a],enumerable:!(p=m(r,a))||p.enumerable});return e};var F=(e,r,t)=>(t=e!=null?f(x(e)):{},s(r||!e||!e.__esModule?o(t,"default",{value:e,enumerable:!0}):t,e)),j=e=>s(o({},"__esModule",{value:!0}),e);var l={};C(l,{default:()=>d.default});module.exports=j(l);var d=F(require("./FeatureCards.js"));
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/biz-components/FeatureCards/index.ts"],
|
|
4
|
+
"sourcesContent": ["export { default } from './FeatureCards.js'\nexport type { FeatureCardsProps, FeatureCardItem } from './types.js'\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wCAAAE,EAAAF,GAAA,IAAAG,EAAwB",
|
|
6
|
+
"names": ["FeatureCards_exports", "__export", "__toCommonJS", "import_FeatureCards"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { Theme } from '../../types/props.js';
|
|
2
|
+
export interface FeatureCardItem {
|
|
3
|
+
/** 卡片标题 */
|
|
4
|
+
title: string;
|
|
5
|
+
/** 卡片副标题/描述 */
|
|
6
|
+
subtitle: string;
|
|
7
|
+
/** 背景图片 URL */
|
|
8
|
+
imageUrl: string;
|
|
9
|
+
/** 主题,默认 light */
|
|
10
|
+
theme?: Theme;
|
|
11
|
+
/** 链接地址 */
|
|
12
|
+
link?: string;
|
|
13
|
+
}
|
|
14
|
+
export interface FeatureCardsProps {
|
|
15
|
+
data: {
|
|
16
|
+
/** 主标题 */
|
|
17
|
+
title: string;
|
|
18
|
+
/** 副标题/描述 */
|
|
19
|
+
subtitle?: string;
|
|
20
|
+
/** 卡片列表 */
|
|
21
|
+
items: FeatureCardItem[];
|
|
22
|
+
};
|
|
23
|
+
/** 自定义类名 */
|
|
24
|
+
className?: string;
|
|
25
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var s=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var p=(e,t,a,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of n(t))!g.call(e,r)&&r!==a&&s(e,r,{get:()=>t[r],enumerable:!(i=m(t,r))||i.enumerable});return e};var l=e=>p(s({},"__esModule",{value:!0}),e);var o={};module.exports=l(o);
|
|
2
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/biz-components/FeatureCards/types.ts"],
|
|
4
|
+
"sourcesContent": ["import type { Theme } from '../../types/props.js'\n\nexport interface FeatureCardItem {\n /** \u5361\u7247\u6807\u9898 */\n title: string\n /** \u5361\u7247\u526F\u6807\u9898/\u63CF\u8FF0 */\n subtitle: string\n /** \u80CC\u666F\u56FE\u7247 URL */\n imageUrl: string\n /** \u4E3B\u9898\uFF0C\u9ED8\u8BA4 light */\n theme?: Theme\n /** \u94FE\u63A5\u5730\u5740 */\n link?: string\n}\n\nexport interface FeatureCardsProps {\n data: {\n /** \u4E3B\u6807\u9898 */\n title: string\n /** \u526F\u6807\u9898/\u63CF\u8FF0 */\n subtitle?: string\n /** \u5361\u7247\u5217\u8868 */\n items: FeatureCardItem[]\n }\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n}\n"],
|
|
5
|
+
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
|
+
"names": ["types_exports", "__toCommonJS"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { FeatureShowcaseProps } from './types.js';
|
|
3
|
+
declare const _default: React.ForwardRefExoticComponent<Omit<Omit<FeatureShowcaseProps & React.RefAttributes<HTMLDivElement>, keyof import("../../shared/Styles.js").StylesProps> & Partial<import("../../shared/Styles.js").StylesProps & import("../../shared/Styles.js").ContainerProps> & {
|
|
4
|
+
className?: string;
|
|
5
|
+
data?: Record<string, any>;
|
|
6
|
+
}, "ref"> & React.RefAttributes<any>>;
|
|
7
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";"use client";var v=Object.create;var m=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var y=(t,p)=>{for(var s in p)m(t,s,{get:p[s],enumerable:!0})},r=(t,p,s,d)=>{if(p&&typeof p=="object"||typeof p=="function")for(let l of N(p))!g.call(t,l)&&l!==s&&m(t,l,{get:()=>p[l],enumerable:!(d=w(p,l))||d.enumerable});return t};var b=(t,p,s)=>(s=t!=null?v(k(t)):{},r(p||!t||!t.__esModule?m(s,"default",{value:t,enumerable:!0}):s,t)),F=t=>r(m({},"__esModule",{value:!0}),t);var M={};y(M,{default:()=>H});module.exports=F(M);var e=require("react/jsx-runtime"),x=b(require("react")),a=require("../../components/index.js"),u=require("../../helpers/utils.js"),f=require("../../shared/Styles.js"),h=require("../../hooks/useExposure.js");const S="image",T="feature_showcase",n=x.default.forwardRef(({data:t,className:p},s)=>{const{datalist:d=[],datalists:l=[]}=t||{},i=(0,x.useRef)(null);return(0,h.useExposure)(i,{componentType:S,componentName:T,componentTitle:"Feature Showcase"}),(0,x.useImperativeHandle)(s,()=>i.current),(0,e.jsxs)("section",{ref:i,"data-ui-component-id":"FeatureShowcase",className:(0,u.cn)("flex gap-[16px] scrollbar-hidden l:flex-row l:overflow-hidden l:overflow-x-scroll laptop:flex-col",p),children:[(0,e.jsx)("div",{className:"flex gap-[16px]",children:d?.map((o,c)=>(0,e.jsx)("div",{children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)(a.Picture,{source:`${o.imageMob}`,className:"w-[296px] rounded-[12px] laptop:hidden"}),(0,e.jsx)(a.Picture,{source:`${o.image} 1024`,className:"l:hidden"}),(0,e.jsxs)("div",{className:"absolute bottom-0 left-0 px-[16px] py-[12px] text-[#fff] laptop:px-[16px] laptop:py-[20px] desktop:px-[32px] desktop:py-[24px] lg-desktop:px-[32px] lg-desktop:py-[32px]",children:[(0,e.jsx)(a.Heading,{as:"h2",size:3,html:o?.title,className:"mt-[16px] md:text-[20px]"}),(0,e.jsx)(a.Text,{as:"p",html:o.desc,size:4,className:"mt-[4px] line-clamp-2 h-[40px] text-[14px] tablet:text-[14px] laptop:text-[14px] desktop:h-fit desktop:text-[16px] lg-desktop:text-[18px]"})]})]})},c))}),(0,e.jsx)("div",{className:"flex gap-[16px]",children:l?.map((o,c)=>(0,e.jsx)("div",{children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)(a.Picture,{source:`${o.imageMob}`,className:"w-[296px] rounded-[12px] laptop:hidden"}),(0,e.jsx)(a.Picture,{source:`${o.image} 1024`,className:"l:hidden"}),(0,e.jsxs)("div",{className:"absolute bottom-0 left-0 px-[16px] py-[12px] text-[#fff] laptop:px-[16px] laptop:py-[20px] desktop:px-[32px] desktop:py-[24px] lg-desktop:px-[32px] lg-desktop:py-[32px]",children:[(0,e.jsx)(a.Heading,{as:"h2",size:3,html:o?.title,className:"mt-[16px] md:text-[20px]"}),(0,e.jsx)(a.Text,{as:"p",html:o.desc,size:4,className:"mt-[4px] line-clamp-2 h-[40px] text-[14px] tablet:text-[14px] laptop:text-[14px] desktop:h-fit desktop:text-[16px] lg-desktop:text-[18px]"})]})]})},c))})]})});n.displayName="FeatureShowcase";var H=(0,f.withLayout)(n);
|
|
2
|
+
//# sourceMappingURL=FeatureShowcase.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/biz-components/FeatureShowcase/FeatureShowcase.tsx"],
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useRef, useImperativeHandle } from 'react'\nimport { Picture, Text, Heading } from '../../components/index.js'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport type { FeatureShowcaseProps, FeatureShowcaseItem } from './types.js'\n\nconst componentType = 'image'\nconst componentName = 'feature_showcase'\n\nconst FeatureShowcase = React.forwardRef<HTMLDivElement, FeatureShowcaseProps>(\n ({ data, className }, ref) => {\n const { datalist = [], datalists = [] } = data || {}\n\n const boxRef = useRef<HTMLDivElement>(null)\n\n useExposure(boxRef, {\n componentType,\n componentName,\n componentTitle: 'Feature Showcase',\n })\n\n useImperativeHandle(ref, () => boxRef.current as HTMLDivElement)\n\n return (\n <section\n ref={boxRef}\n data-ui-component-id=\"FeatureShowcase\"\n className={cn(\n 'flex gap-[16px] scrollbar-hidden l:flex-row l:overflow-hidden l:overflow-x-scroll laptop:flex-col',\n className\n )}\n >\n <div className=\"flex gap-[16px]\">\n {datalist?.map((item: FeatureShowcaseItem, index: number) => (\n <div key={index}>\n <div className=\"relative\">\n <Picture\n source={`${item.imageMob}`}\n className=\"w-[296px] rounded-[12px] laptop:hidden\"\n />\n <Picture source={`${item.image} 1024`} className=\"l:hidden\" />\n <div className=\"absolute bottom-0 left-0 px-[16px] py-[12px] text-[#fff] laptop:px-[16px] laptop:py-[20px] desktop:px-[32px] desktop:py-[24px] lg-desktop:px-[32px] lg-desktop:py-[32px]\">\n <Heading\n as={'h2'}\n size={3}\n html={item?.title}\n className=\"mt-[16px] md:text-[20px]\"\n />\n\n <Text\n as={'p'}\n html={item.desc}\n size={4}\n className=\"mt-[4px] line-clamp-2 h-[40px] text-[14px] tablet:text-[14px] laptop:text-[14px] desktop:h-fit desktop:text-[16px] lg-desktop:text-[18px]\"\n />\n </div>\n </div>\n </div>\n ))}\n </div>\n <div className=\"flex gap-[16px]\">\n {datalists?.map((item: FeatureShowcaseItem, index: number) => (\n <div key={index}>\n <div className=\"relative\">\n <Picture\n source={`${item.imageMob}`}\n className=\"w-[296px] rounded-[12px] laptop:hidden\"\n />\n <Picture source={`${item.image} 1024`} className=\"l:hidden\" />\n <div className=\"absolute bottom-0 left-0 px-[16px] py-[12px] text-[#fff] laptop:px-[16px] laptop:py-[20px] desktop:px-[32px] desktop:py-[24px] lg-desktop:px-[32px] lg-desktop:py-[32px]\">\n <Heading\n as={'h2'}\n size={3}\n html={item?.title}\n className=\"mt-[16px] md:text-[20px]\"\n />\n\n <Text\n as={'p'}\n html={item.desc}\n size={4}\n className=\"mt-[4px] line-clamp-2 h-[40px] text-[14px] tablet:text-[14px] laptop:text-[14px] desktop:h-fit desktop:text-[16px] lg-desktop:text-[18px]\"\n />\n </div>\n </div>\n </div>\n ))}\n </div>\n </section>\n )\n }\n)\n\nFeatureShowcase.displayName = 'FeatureShowcase'\n\nexport default withLayout(FeatureShowcase)\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsCgB,IAAAI,EAAA,6BArChBC,EAAmD,oBACnDC,EAAuC,qCACvCC,EAAmB,kCACnBC,EAA2B,kCAC3BC,EAA4B,sCAG5B,MAAMC,EAAgB,QAChBC,EAAgB,mBAEhBC,EAAkB,EAAAC,QAAM,WAC5B,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,EAAGC,IAAQ,CAC5B,KAAM,CAAE,SAAAC,EAAW,CAAC,EAAG,UAAAC,EAAY,CAAC,CAAE,EAAIJ,GAAQ,CAAC,EAE7CK,KAAS,UAAuB,IAAI,EAE1C,wBAAYA,EAAQ,CAClB,cAAAT,EACA,cAAAC,EACA,eAAgB,kBAClB,CAAC,KAED,uBAAoBK,EAAK,IAAMG,EAAO,OAAyB,KAG7D,QAAC,WACC,IAAKA,EACL,uBAAqB,kBACrB,aAAW,MACT,oGACAJ,CACF,EAEA,oBAAC,OAAI,UAAU,kBACZ,SAAAE,GAAU,IAAI,CAACG,EAA2BC,OACzC,OAAC,OACC,oBAAC,OAAI,UAAU,WACb,oBAAC,WACC,OAAQ,GAAGD,EAAK,QAAQ,GACxB,UAAU,yCACZ,KACA,OAAC,WAAQ,OAAQ,GAAGA,EAAK,KAAK,QAAS,UAAU,WAAW,KAC5D,QAAC,OAAI,UAAU,2KACb,oBAAC,WACC,GAAI,KACJ,KAAM,EACN,KAAMA,GAAM,MACZ,UAAU,2BACZ,KAEA,OAAC,QACC,GAAI,IACJ,KAAMA,EAAK,KACX,KAAM,EACN,UAAU,4IACZ,GACF,GACF,GAtBQC,CAuBV,CACD,EACH,KACA,OAAC,OAAI,UAAU,kBACZ,SAAAH,GAAW,IAAI,CAACE,EAA2BC,OAC1C,OAAC,OACC,oBAAC,OAAI,UAAU,WACb,oBAAC,WACC,OAAQ,GAAGD,EAAK,QAAQ,GACxB,UAAU,yCACZ,KACA,OAAC,WAAQ,OAAQ,GAAGA,EAAK,KAAK,QAAS,UAAU,WAAW,KAC5D,QAAC,OAAI,UAAU,2KACb,oBAAC,WACC,GAAI,KACJ,KAAM,EACN,KAAMA,GAAM,MACZ,UAAU,2BACZ,KAEA,OAAC,QACC,GAAI,IACJ,KAAMA,EAAK,KACX,KAAM,EACN,UAAU,4IACZ,GACF,GACF,GAtBQC,CAuBV,CACD,EACH,GACF,CAEJ,CACF,EAEAT,EAAgB,YAAc,kBAE9B,IAAOV,KAAQ,cAAWU,CAAe",
|
|
6
|
+
"names": ["FeatureShowcase_exports", "__export", "FeatureShowcase_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_utils", "import_Styles", "import_useExposure", "componentType", "componentName", "FeatureShowcase", "React", "data", "className", "ref", "datalist", "datalists", "boxRef", "item", "index"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var m=Object.create;var a=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var x=(e,t)=>{for(var o in t)a(e,o,{get:t[o],enumerable:!0})},s=(e,t,o,p)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of c(t))!w.call(e,r)&&r!==o&&a(e,r,{get:()=>t[r],enumerable:!(p=u(t,r))||p.enumerable});return e};var y=(e,t,o)=>(o=e!=null?m(h(e)):{},s(t||!e||!e.__esModule?a(o,"default",{value:e,enumerable:!0}):o,e)),F=e=>s(a({},"__esModule",{value:!0}),e);var S={};x(S,{default:()=>f.default});module.exports=F(S);var f=y(require("./FeatureShowcase.js"));
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/biz-components/FeatureShowcase/index.ts"],
|
|
4
|
+
"sourcesContent": ["export { default } from './FeatureShowcase.js'\nexport type { FeatureShowcaseProps, FeatureShowcaseItem } from './types.js'\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wCAAAE,EAAAF,GAAA,IAAAG,EAAwB",
|
|
6
|
+
"names": ["FeatureShowcase_exports", "__export", "__toCommonJS", "import_FeatureShowcase"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export interface FeatureShowcaseItem {
|
|
2
|
+
/** 标题 */
|
|
3
|
+
title: string;
|
|
4
|
+
/** 描述文本 */
|
|
5
|
+
desc: string;
|
|
6
|
+
/** 桌面端图片 URL */
|
|
7
|
+
image: string;
|
|
8
|
+
/** 移动端图片 URL */
|
|
9
|
+
imageMob: string;
|
|
10
|
+
}
|
|
11
|
+
export interface FeatureShowcaseProps {
|
|
12
|
+
data: {
|
|
13
|
+
/** 第一组数据列表 */
|
|
14
|
+
datalist: FeatureShowcaseItem[];
|
|
15
|
+
/** 第二组数据列表 */
|
|
16
|
+
datalists: FeatureShowcaseItem[];
|
|
17
|
+
};
|
|
18
|
+
/** 自定义类名 */
|
|
19
|
+
className?: string;
|
|
20
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var r=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var n=(t,e,i,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of o(e))!g.call(t,a)&&a!==i&&r(t,a,{get:()=>e[a],enumerable:!(s=c(e,a))||s.enumerable});return t};var m=t=>n(r({},"__esModule",{value:!0}),t);var d={};module.exports=m(d);
|
|
2
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/biz-components/FeatureShowcase/types.ts"],
|
|
4
|
+
"sourcesContent": ["export interface FeatureShowcaseItem {\n /** \u6807\u9898 */\n title: string\n /** \u63CF\u8FF0\u6587\u672C */\n desc: string\n /** \u684C\u9762\u7AEF\u56FE\u7247 URL */\n image: string\n /** \u79FB\u52A8\u7AEF\u56FE\u7247 URL */\n imageMob: string\n}\n\nexport interface FeatureShowcaseProps {\n data: {\n /** \u7B2C\u4E00\u7EC4\u6570\u636E\u5217\u8868 */\n datalist: FeatureShowcaseItem[]\n /** \u7B2C\u4E8C\u7EC4\u6570\u636E\u5217\u8868 */\n datalists: FeatureShowcaseItem[]\n }\n /** \u81EA\u5B9A\u4E49\u7C7B\u540D */\n className?: string\n}\n"],
|
|
5
|
+
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
|
+
"names": ["types_exports", "__toCommonJS"]
|
|
7
|
+
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var B=Object.create;var b=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,D=Object.prototype.hasOwnProperty;var A=(t,a)=>{for(var o in a)b(t,o,{get:a[o],enumerable:!0})},v=(t,a,o,l)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of C(a))!D.call(t,i)&&i!==o&&b(t,i,{get:()=>a[i],enumerable:!(l=M(a,i))||l.enumerable});return t};var L=(t,a,o)=>(o=t!=null?B(F(t)):{},v(a||!t||!t.__esModule?b(o,"default",{value:t,enumerable:!0}):o,t)),E=t=>v(b({},"__esModule",{value:!0}),t);var j={};A(j,{default:()=>O});module.exports=E(j);var e=require("react/jsx-runtime"),c=require("react"),s=require("../../components/index.js"),y=L(require("../Subscribe/index.js")),k=require("./types.js"),x=require("./icons/index.js"),u=require("react-responsive"),f=require("../../helpers/utils.js"),w=require("../../shared/Styles.js");const S=({data:{footerNavigation:t}={},currentCountry:a,event:o,subscribeLoading:l})=>{const[i,m]=(0,c.useState)(!1),r=(0,u.useMediaQuery)({query:"(max-width: 1439px)"});(0,c.useEffect)(()=>{m(r)},[r]);const d=(0,c.useMemo)(()=>t?.footerBlocks?.find(p=>p?.blockType===k.FooterNavigationBlockType.Brand)?.country||{},[t]);return(0,e.jsxs)(s.Container,{childClassName:"bg-black py-8 laptop:py-16 flex flex-col desktop:gap-16 gap-8",children:[(0,e.jsx)(s.Text,{html:t?.story,className:"desktop:text-sm text-xs font-bold text-[#6D6D6F]"}),t?.footerBlocks?.map(p=>{if(p?.blockType===k.FooterNavigationBlockType.Signup)return(0,e.jsx)(T,{subscribeLoading:l,data:p,onSubmit:o?.signup});if(p?.blockType===k.FooterNavigationBlockType.Brand)return(0,e.jsx)(z,{data:p,isMobile:i,event:o,currentCountry:a});if(p?.blockType===k.FooterNavigationBlockType.Main)return(0,e.jsx)($,{data:{...p,country:d},event:o,isMobile:i,currentCountry:a})})]})},T=({data:t,onSubmit:a,subscribeLoading:o})=>(0,e.jsxs)("div",{className:"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row flex flex-col gap-8 rounded-btn bg-[#1D1D1F] px-4 py-8",children:[(0,e.jsx)(y.default,{subscribeMetadata:t?.signup,className:"desktop:flex-[744]",onSubmit:a,loading:o}),(0,e.jsx)("div",{className:"desktop:hidden h-px w-full bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.enjoy?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.enjoy?.enjoys?.map(l=>(0,e.jsxs)("div",{className:"flex-start flex gap-2",children:[(0,e.jsx)(s.Picture,{source:l?.icon?.url,alt:l?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Text,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})]},l?.id))})]}),(0,e.jsx)("div",{className:"w-px bg-[#3D3E3F] hidden desktop:block"}),(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.benefit?.title,className:"text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.benefit?.benefits?.map(l=>(0,e.jsx)(s.Link,{href:`${l?.link}?ref=footer`,asChild:!l?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},l?.id))})]})]})]}),$=({data:t,event:a,isMobile:o,currentCountry:l})=>{const[i,m]=(0,c.useState)(!1),{services:r,mainNav:d,country:p}=t;return(0,e.jsxs)("div",{className:"flex flex-col gap-8",children:[(0,e.jsxs)("div",{className:(0,f.cn)({"desktop:gap-16 flex":r?.download?.title}),children:[(0,e.jsxs)("div",{className:(0,f.cn)("w-full",{"desktop:flex-[1260]":r?.download?.title}),children:[(0,e.jsx)(s.Text,{html:r?.storeBenefits?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:(0,f.cn)("laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2",{"desktop:max-w-[648px]":r?.download?.title}),children:r?.storeBenefits?.reasons?.map(n=>(0,e.jsxs)("div",{className:"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2",children:[(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,asChild:!n?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:n?.label,className:"text-sm desktop:text-base font-bold leading-[1.2] text-[#B6B6BA]"})})]},n?.id))})]}),(0,e.jsx)(N,{className:(0,f.cn)({"desktop:flex-[404] hidden desktop:block":r?.download?.title}),title:r?.download?.title,apps:r?.download?.apps})]}),(0,e.jsx)("div",{className:"desktop:block hidden h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:grid grid-cols-4 gap-4",children:[(0,e.jsx)(h,{title:d?.products?.title,lists:d?.products?.products}),(0,e.jsx)(h,{title:d?.explore?.title,lists:d?.explore?.explores}),(0,e.jsx)(h,{title:d?.support?.title,lists:d?.support?.supports}),(0,e.jsxs)("div",{className:"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4",children:[(0,e.jsxs)("div",{className:"desktop:pb-0 flex items-center justify-between pb-4",children:[(0,e.jsx)(s.Text,{as:"p",html:d?.contact?.title,className:"text-xl font-bold leading-[1.2] text-white"}),o&&(0,e.jsx)("button",{onClick:()=>m(!i),children:i?(0,e.jsx)(x.SubtractIcon,{width:20,height:20}):(0,e.jsx)(x.AddIcon,{width:20,height:20})})]}),(i&&o||!o)&&(0,e.jsx)("div",{className:"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2",children:d?.contact?.contacts?.map(n=>(0,e.jsxs)("div",{className:"flex items-start gap-2",children:[(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:n?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:n?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})})]},n?.id))}),(0,e.jsx)(g,{country:l||p,className:"desktop:hidden border-b border-[#3D3E3F]",isMobile:o,onChangeCountry:a?.country}),(0,e.jsx)("div",{className:"desktop:hidden mt-8",children:(0,e.jsx)(N,{title:r?.download?.title,apps:r?.download?.apps})}),!!d?.socials?.length&&(0,e.jsx)("div",{className:"mt-8 flex items-center gap-2",children:d?.socials?.map(n=>(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,children:(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-8 shrink-0"})},n?.id))}),(0,e.jsx)("div",{className:"mt-4 flex flex-wrap gap-2",children:d?.payment?.map(n=>(0,e.jsx)(s.Link,{href:n?.link,children:(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"h-[28px] w-[44px] shrink-0"})},n?.id))})]})]})]})},z=({data:t,isMobile:a,event:o,currentCountry:l})=>(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"desktop:items-center desktop:flex desktop:gap-4",children:[(0,e.jsxs)("div",{className:"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4",children:[(0,e.jsx)(s.Text,{html:t?.brand?.currentBrand,className:"text-[#B6B6BA]"}),(0,e.jsx)("div",{className:"laptop:block hidden h-[20px] w-px bg-[#B6B6BA] laptop:mb-[10px]"}),(0,e.jsx)("div",{className:"desktop:gap-6 flex flex-wrap items-center gap-4",children:t?.brand?.brands?.map(i=>(0,e.jsx)(s.Link,{href:`${i?.link}?ref=footer`,children:(0,e.jsx)(s.Text,{html:i?.icon,className:"text-[#B6B6BA] hover:text-white"})},i?.id))})]}),(0,e.jsx)(g,{country:l||t?.country,className:"desktop:flex-[316] desktop:block hidden",isMobile:a,onChangeCountry:o?.country})]}),(0,e.jsx)("div",{className:"h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1",children:[(0,e.jsx)(s.Text,{html:t?.copyright?.label,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsx)("div",{className:"flex flex-wrap items-center gap-x-2 gap-y-1",children:t?.policy?.policies?.map(i=>(0,e.jsx)(s.Link,{href:`${i?.link}?ref=footer`,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline",children:i?.label},i?.id))})]})]}),h=({title:t,lists:a,className:o})=>{const[l,i]=(0,c.useState)(!1),[m,r]=(0,c.useState)(!1),d=(0,u.useMediaQuery)({query:"(max-width: 1439px)"});return(0,c.useEffect)(()=>{r(d)},[d]),(0,e.jsxs)("div",{className:(0,f.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",o),children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",onClick:()=>i(!l),children:[(0,e.jsx)(s.Text,{as:"p",html:t,className:"text-xl font-bold leading-[1.2] text-white"}),m&&(0,e.jsx)(e.Fragment,{children:l?(0,e.jsx)(x.SubtractIcon,{width:20,height:20}):(0,e.jsx)(x.AddIcon,{width:20,height:20})})]}),(l&&m||!m)&&(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:a?.map(p=>(0,e.jsx)(s.Link,{href:`${p?.link}?ref=footer`,className:"no-underline",children:(0,e.jsx)(s.Text,{html:p?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},p?.id))})]})},N=({title:t,apps:a,className:o})=>a?.length?(0,e.jsxs)("div",{className:o,children:[(0,e.jsx)(s.Text,{html:t,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex items-center gap-4",children:a?.map(l=>(0,e.jsxs)("div",{className:"flex flex-col items-center gap-[6px]",children:[(0,e.jsx)(s.Link,{href:l?.link,children:(0,e.jsx)(s.Picture,{source:l?.icon?.url,alt:l?.icon?.alt,className:"size-10 shrink-0"})}),l?.label&&(0,e.jsx)(s.Text,{html:l?.label,className:"text-xs font-bold text-[#999999]"})]},l?.id))})]}):null,g=({country:t,isMobile:a,className:o,onChangeCountry:l})=>(0,e.jsx)("div",{className:(0,f.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",o),onClick:()=>l?.(),children:(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex cursor-pointer items-center gap-2",children:[(0,e.jsx)(x.CountryIcon,{width:20,height:20,className:"shrink-0"}),(0,e.jsx)(s.Text,{as:"p",html:t?.countryName||t?.country,className:"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white"})]}),a&&(0,e.jsx)("button",{children:(0,e.jsx)(x.ArrowRightIcon,{width:20,height:20})})]})});var O=(0,w.withLayout)(S);
|
|
1
|
+
"use strict";var B=Object.create;var k=Object.defineProperty;var M=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var F=Object.getPrototypeOf,D=Object.prototype.hasOwnProperty;var A=(t,a)=>{for(var o in a)k(t,o,{get:a[o],enumerable:!0})},v=(t,a,o,l)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of C(a))!D.call(t,i)&&i!==o&&k(t,i,{get:()=>a[i],enumerable:!(l=M(a,i))||l.enumerable});return t};var L=(t,a,o)=>(o=t!=null?B(F(t)):{},v(a||!t||!t.__esModule?k(o,"default",{value:t,enumerable:!0}):o,t)),E=t=>v(k({},"__esModule",{value:!0}),t);var j={};A(j,{default:()=>O});module.exports=E(j);var e=require("react/jsx-runtime"),c=require("react"),s=require("../../components/index.js"),y=L(require("../Subscribe/index.js")),h=require("./types.js"),x=require("./icons/index.js"),u=require("react-responsive"),f=require("../../helpers/utils.js"),w=require("../../shared/Styles.js");const S=({data:{footerNavigation:t}={},currentCountry:a,event:o,subscribeLoading:l})=>{const[i,m]=(0,c.useState)(!1),r=(0,u.useMediaQuery)({query:"(max-width: 1439px)"});(0,c.useEffect)(()=>{m(r)},[r]);const d=(0,c.useMemo)(()=>t?.footerBlocks?.find(p=>p?.blockType===h.FooterNavigationBlockType.Brand)?.country||{},[t]);return(0,e.jsxs)(s.Container,{childClassName:"bg-black py-8 laptop:py-16 flex flex-col desktop:gap-16 gap-8",children:[(0,e.jsx)(s.Text,{html:t?.story,className:"desktop:text-sm text-xs font-bold text-[#6D6D6F]"}),t?.footerBlocks?.map(p=>{if(p?.blockType===h.FooterNavigationBlockType.Signup)return(0,e.jsx)(T,{subscribeLoading:l,data:p,onSubmit:o?.signup});if(p?.blockType===h.FooterNavigationBlockType.Brand)return(0,e.jsx)(z,{data:p,isMobile:i,event:o,currentCountry:a});if(p?.blockType===h.FooterNavigationBlockType.Main)return(0,e.jsx)($,{data:{...p,country:d},event:o,isMobile:i,currentCountry:a})})]})},T=({data:t,onSubmit:a,subscribeLoading:o})=>(0,e.jsxs)("div",{className:"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row flex flex-col gap-8 rounded-btn bg-[#1D1D1F] px-4 py-8",children:[(0,e.jsx)(y.default,{subscribeMetadata:t?.signup,className:"desktop:flex-[744]",onSubmit:a,loading:o}),(0,e.jsx)("div",{className:"desktop:hidden h-px w-full bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.enjoy?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.enjoy?.enjoys?.map(l=>(0,e.jsxs)("div",{className:"flex-start flex gap-2",children:[(0,e.jsx)(s.Picture,{source:l?.icon?.url,alt:l?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Text,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]"})]},l?.id))})]}),(0,e.jsx)("div",{className:"w-px bg-[#3D3E3F] hidden desktop:block"}),(0,e.jsxs)("div",{className:"flex-1",children:[(0,e.jsx)(s.Text,{html:t?.benefit?.title,className:"text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:t?.benefit?.benefits?.map(l=>(0,e.jsx)(s.Link,{href:`${l?.link}?ref=footer`,asChild:!l?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:l?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},l?.id))})]})]})]}),$=({data:t,event:a,isMobile:o,currentCountry:l})=>{const[i,m]=(0,c.useState)(!1),{services:r,mainNav:d,country:p}=t;return(0,e.jsxs)("div",{className:"flex flex-col gap-8",children:[(0,e.jsxs)("div",{className:(0,f.cn)({"desktop:gap-16 flex":r?.download?.title}),children:[(0,e.jsxs)("div",{className:(0,f.cn)("w-full",{"desktop:flex-[1260]":r?.download?.title}),children:[(0,e.jsx)(s.Text,{html:r?.storeBenefits?.title,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:(0,f.cn)("laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2",{"desktop:max-w-[648px]":r?.download?.title}),children:r?.storeBenefits?.reasons?.map(n=>(0,e.jsxs)("div",{className:"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2",children:[(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,asChild:!n?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:n?.label,className:"text-sm desktop:text-base font-bold leading-[1.2] text-[#B6B6BA]"})})]},n?.id))})]}),(0,e.jsx)(N,{className:(0,f.cn)({"desktop:flex-[404] hidden desktop:block":r?.download?.title}),title:r?.download?.title,apps:r?.download?.apps})]}),(0,e.jsx)("div",{className:"desktop:block hidden h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"desktop:grid grid-cols-4 gap-4",children:[(0,e.jsx)(b,{title:d?.products?.title,lists:d?.products?.products}),(0,e.jsx)(b,{title:d?.explore?.title,lists:d?.explore?.explores}),(0,e.jsx)(b,{title:d?.support?.title,lists:d?.support?.supports}),(0,e.jsxs)("div",{className:"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4",children:[(0,e.jsxs)("div",{className:"desktop:pb-0 flex items-center justify-between pb-4",children:[(0,e.jsx)(s.Text,{as:"p",html:d?.contact?.title,className:"text-xl font-bold leading-[1.2] text-white"}),o&&(0,e.jsx)("button",{onClick:()=>m(!i),children:i?(0,e.jsx)(x.SubtractIcon,{width:20,height:20}):(0,e.jsx)(x.AddIcon,{width:20,height:20})})]}),(i&&o||!o)&&(0,e.jsx)("div",{className:"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2",children:d?.contact?.contacts?.map(n=>(0,e.jsxs)("div",{className:"flex items-start gap-2",children:[(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-5 shrink-0"}),(0,e.jsx)(s.Link,{href:n?.link,className:"no-underline",children:(0,e.jsx)(s.Text,{html:n?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})})]},n?.id))}),(0,e.jsx)(g,{country:l||p,className:"desktop:hidden border-b border-[#3D3E3F]",isMobile:o,onChangeCountry:a?.country}),(0,e.jsx)("div",{className:"desktop:hidden mt-8",children:(0,e.jsx)(N,{title:r?.download?.title,apps:r?.download?.apps})}),!!d?.socials?.length&&(0,e.jsx)("div",{className:"mt-8 flex items-center gap-2",children:d?.socials?.map(n=>(0,e.jsx)(s.Link,{href:`${n?.link}?ref=footer`,children:(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"size-8 shrink-0"})},n?.id))}),(0,e.jsx)("div",{className:"mt-4 flex flex-wrap gap-2",children:d?.payment?.map(n=>(0,e.jsx)(s.Link,{href:n?.link,children:(0,e.jsx)(s.Picture,{source:n?.icon?.url,alt:n?.icon?.alt,className:"h-[28px] w-[44px] shrink-0"})},n?.id))})]})]})]})},z=({data:t,isMobile:a,event:o,currentCountry:l})=>(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[(0,e.jsxs)("div",{className:"desktop:items-center desktop:flex desktop:gap-4",children:[(0,e.jsxs)("div",{className:"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4",children:[(0,e.jsx)(s.Text,{html:t?.brand?.currentBrand,className:"text-[#B6B6BA]"}),(0,e.jsx)("div",{className:"laptop:block hidden h-[20px] w-px bg-[#B6B6BA] laptop:mb-[10px]"}),(0,e.jsx)("div",{className:"desktop:gap-6 flex flex-wrap items-center gap-4",children:t?.brand?.brands?.map(i=>(0,e.jsx)(s.Link,{href:`${i?.link}?ref=footer`,children:(0,e.jsx)(s.Text,{html:i?.icon,className:"text-[#B6B6BA] hover:text-white"})},i?.id))})]}),(0,e.jsx)(g,{country:l||t?.country,className:"desktop:flex-[316] desktop:block hidden",isMobile:a,onChangeCountry:o?.country})]}),(0,e.jsx)("div",{className:"h-px bg-[#3D3E3F]"}),(0,e.jsxs)("div",{className:"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1",children:[(0,e.jsx)(s.Text,{html:t?.copyright?.label,className:"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsx)("div",{className:"flex flex-wrap items-center gap-x-2 gap-y-1",children:t?.policy?.policies?.map(i=>(0,e.jsx)(s.Link,{href:`${i?.link}?ref=footer`,className:"desktop:text-base text-xs font-bold hover:text-white leading-[1.4] text-[#B6B6BA] no-underline",children:i?.label},i?.id))})]})]}),b=({title:t,lists:a,className:o})=>{const[l,i]=(0,c.useState)(!1),[m,r]=(0,c.useState)(!1),d=(0,u.useMediaQuery)({query:"(max-width: 1439px)"});return(0,c.useEffect)(()=>{r(d)},[d]),(0,e.jsxs)("div",{className:(0,f.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",o),children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",onClick:()=>i(!l),children:[(0,e.jsx)(s.Text,{as:"p",html:t,className:"text-xl font-bold leading-[1.2] text-white"}),m&&(0,e.jsx)(e.Fragment,{children:l?(0,e.jsx)(x.SubtractIcon,{width:20,height:20}):(0,e.jsx)(x.AddIcon,{width:20,height:20})})]}),(l&&m||!m)&&(0,e.jsx)("div",{className:"mt-4 flex flex-col gap-2",children:a?.map(p=>(0,e.jsx)(s.Link,{href:`${p?.link}?ref=footer`,className:"no-underline",children:(0,e.jsx)(s.Text,{html:p?.label,className:"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white"})},p?.id))})]})},N=({title:t,apps:a,className:o})=>a?.length?(0,e.jsxs)("div",{className:o,children:[(0,e.jsx)(s.Text,{html:t,className:" text-xl font-bold leading-[1.2] text-white"}),(0,e.jsx)("div",{className:"mt-4 flex items-center gap-4",children:a?.map(l=>(0,e.jsxs)("div",{className:"flex flex-col items-center gap-[6px]",children:[(0,e.jsx)(s.Link,{href:l?.link,children:(0,e.jsx)(s.Picture,{source:l?.icon?.url,alt:l?.icon?.alt,className:"size-10 shrink-0"})}),l?.label&&(0,e.jsx)(s.Text,{html:l?.label,className:"text-xs font-bold text-[#999999]"})]},l?.id))})]}):null,g=({country:t,isMobile:a,className:o,onChangeCountry:l})=>(0,e.jsx)("div",{className:(0,f.cn)("desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4",o),onClick:()=>l?.(),children:(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex cursor-pointer items-center gap-2",children:[(0,e.jsx)(x.CountryIcon,{width:20,height:20,className:"shrink-0"}),(0,e.jsx)(s.Text,{as:"p",html:t?.countryName||t?.country,className:"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white"})]}),a&&(0,e.jsx)("button",{children:(0,e.jsx)(x.ArrowRightIcon,{width:20,height:20})})]})});var O=(0,w.withLayout)(S);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/FooterNavigation/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useEffect, useMemo, useState } from 'react'\nimport { Picture, Text, Container, Link } from '../../components/index.js'\nimport Subscribe from '../Subscribe/index.js'\nimport type { FooterNavigationProps } from './types.js'\nimport { FooterNavigationBlockType } from './types.js'\nimport { AddIcon, SubtractIcon, ArrowRightIcon, CountryIcon } from './icons/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst FooterNavigation = ({\n data: { footerNavigation } = {},\n currentCountry,\n event,\n subscribeLoading,\n}: FooterNavigationProps) => {\n const [isMobile, setIsMobile] = useState(false)\n\n const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\n\n const country = useMemo(() => {\n return (\n footerNavigation?.footerBlocks?.find((block: any) => block?.blockType === FooterNavigationBlockType.Brand)\n ?.country || {}\n )\n }, [footerNavigation])\n\n return (\n <Container childClassName=\"bg-black py-8 laptop:py-16 flex flex-col desktop:gap-16 gap-8\">\n <Text html={footerNavigation?.story} className=\"desktop:text-sm text-xs font-bold text-[#6D6D6F]\" />\n {footerNavigation?.footerBlocks?.map((block: any) => {\n if (block?.blockType === FooterNavigationBlockType.Signup) {\n return <MarketingConversion subscribeLoading={subscribeLoading} data={block} onSubmit={event?.signup} />\n }\n if (block?.blockType === FooterNavigationBlockType.Brand) {\n return <FooterBrand data={block} isMobile={isMobile} event={event} currentCountry={currentCountry} />\n }\n if (block?.blockType === FooterNavigationBlockType.Main) {\n return (\n <MainServices\n data={{ ...block, country }}\n event={event}\n isMobile={isMobile}\n currentCountry={currentCountry}\n />\n )\n }\n })}\n </Container>\n )\n}\n\n/**\n * MarketingConversion \u8425\u9500\u8F6C\u5316\u6A21\u5757\n * @param data\n * @param onSubmit signup\u63D0\u4EA4\u4E8B\u4EF6\n * @returns\n */\nconst MarketingConversion = ({ data, onSubmit, subscribeLoading }: { data: any; onSubmit?: (params: any) => void; subscribeLoading?: boolean }) => {\n return (\n <div className=\"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row flex flex-col gap-8 rounded-btn bg-[#1D1D1F] px-4 py-8\">\n <Subscribe\n subscribeMetadata={data?.signup}\n className=\"desktop:flex-[744]\"\n onSubmit={onSubmit}\n loading={subscribeLoading}\n />\n <div className=\"desktop:hidden h-px w-full bg-[#3D3E3F]\" />\n <div className=\"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4\">\n <div className=\"flex-1\">\n <Text html={data?.enjoy?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n <div className=\"mt-4 flex flex-col gap-2\">\n {data?.enjoy?.enjoys?.map((enjoyItem: any) => (\n <div key={enjoyItem?.id} className=\"flex-start flex gap-2\">\n <Picture source={enjoyItem?.icon?.url} alt={enjoyItem?.icon?.alt} className=\"size-5 shrink-0\" />\n <Text\n html={enjoyItem?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n />\n </div>\n ))}\n </div>\n </div>\n <div className=\"w-px bg-[#3D3E3F] hidden desktop:block\" />\n <div className=\"flex-1\">\n <Text html={data?.benefit?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n <div className=\"mt-4 flex flex-col gap-2\">\n {data?.benefit?.benefits?.map((benefitItem: any) => (\n <Link\n href={`${benefitItem?.link}?ref=footer`}\n asChild={!benefitItem?.link}\n key={benefitItem?.id}\n className=\"no-underline\"\n >\n <Text\n html={benefitItem?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n />\n </Link>\n ))}\n </div>\n </div>\n </div>\n </div>\n )\n}\n\n/**\n * MainServices \u4E3B\u5BFC\u822A\u4E0E\u670D\u52A1\u6A21\u5757\n * @param services \u670D\u52A1\n * @param mainNav \u4E3B\u5BFC\u822A\n * @param event \u4E8B\u4EF6\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @param currentCountry \u5F53\u524D\u56FD\u5BB6\n * @returns\n */\nconst MainServices = ({\n data,\n event,\n isMobile,\n currentCountry,\n}: {\n data: any\n event: any\n isMobile: boolean\n currentCountry: any\n}) => {\n const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n const { services, mainNav, country } = data\n return (\n <div className=\"flex flex-col gap-8\">\n <div\n className={cn({\n 'desktop:gap-16 flex': services?.download?.title,\n })}\n >\n <div\n className={cn('w-full', {\n 'desktop:flex-[1260]': services?.download?.title,\n })}\n >\n <Text html={services?.storeBenefits?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n <div\n className={cn('laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2', {\n 'desktop:max-w-[648px]': services?.download?.title,\n })}\n >\n {services?.storeBenefits?.reasons?.map((reasonItem: any) => (\n <div key={reasonItem?.id} className=\"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2\">\n <Picture source={reasonItem?.icon?.url} alt={reasonItem?.icon?.alt} className=\"size-5 shrink-0\" />\n <Link href={`${reasonItem?.link}?ref=footer`} asChild={!reasonItem?.link} className=\"no-underline\">\n <Text\n html={reasonItem?.label}\n className=\"text-sm desktop:text-base font-bold leading-[1.2] text-[#B6B6BA]\"\n />\n </Link>\n </div>\n ))}\n </div>\n </div>\n <DownloadApp\n className={cn({\n 'desktop:flex-[404] hidden desktop:block': services?.download?.title,\n })}\n title={services?.download?.title}\n apps={services?.download?.apps}\n />\n </div>\n <div className=\"desktop:block hidden h-px bg-[#3D3E3F]\" />\n <div className=\"desktop:grid grid-cols-4 gap-4\">\n <MainNavMenu title={mainNav?.products?.title} lists={mainNav?.products?.products} />\n <MainNavMenu title={mainNav?.explore?.title} lists={mainNav?.explore?.explores} />\n <MainNavMenu title={mainNav?.support?.title} lists={mainNav?.support?.supports} />\n <div className=\"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4\">\n <div className=\"desktop:pb-0 flex items-center justify-between pb-4\">\n <Text as=\"p\" html={mainNav?.contact?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n {isMobile && (\n <button onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n </button>\n )}\n </div>\n {((mainNavMenuOpen && isMobile) || !isMobile) && (\n <div className=\"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2\">\n {mainNav?.contact?.contacts?.map((contactItem: any) => (\n <div key={contactItem?.id} className=\"flex items-start gap-2\">\n <Picture source={contactItem?.icon?.url} alt={contactItem?.icon?.alt} className=\"size-5 shrink-0\" />\n <Link href={contactItem?.link} className=\"no-underline\">\n <Text\n html={contactItem?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n />\n </Link>\n </div>\n ))}\n </div>\n )}\n <ChangeCountry\n country={currentCountry || country}\n className=\"desktop:hidden border-b border-[#3D3E3F]\"\n isMobile={isMobile}\n onChangeCountry={event?.country}\n />\n <div className=\"desktop:hidden mt-8\">\n <DownloadApp title={services?.download?.title} apps={services?.download?.apps} />\n </div>\n {!!mainNav?.socials?.length && (\n <div className=\"mt-8 flex items-center gap-2\">\n {mainNav?.socials?.map((socialItem: any) => (\n <Link href={`${socialItem?.link}?ref=footer`} key={socialItem?.id}>\n <Picture source={socialItem?.icon?.url} alt={socialItem?.icon?.alt} className=\"size-8 shrink-0\" />\n </Link>\n ))}\n </div>\n )}\n <div className=\"mt-4 flex flex-wrap gap-2\">\n {mainNav?.payment?.map((paymentItem: any) => (\n <Link href={paymentItem?.link} key={paymentItem?.id}>\n <Picture\n source={paymentItem?.icon?.url}\n alt={paymentItem?.icon?.alt}\n className=\"h-[28px] w-[44px] shrink-0\"\n />\n </Link>\n ))}\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nconst FooterBrand = ({\n data,\n isMobile,\n event,\n currentCountry,\n}: {\n data: any\n isMobile: boolean\n event: any\n currentCountry: any\n}) => {\n return (\n <div className=\"flex flex-col gap-4\">\n <div className=\"desktop:items-center desktop:flex desktop:gap-4\">\n <div className=\"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4\">\n <Text html={data?.brand?.currentBrand} className=\"text-[#B6B6BA]\" />\n <div className=\"laptop:block hidden h-[20px] w-px bg-[#B6B6BA] laptop:mb-[10px]\" />\n <div className=\"desktop:gap-6 flex flex-wrap items-center gap-4\">\n {data?.brand?.brands?.map((brandItem: any) => (\n <Link href={`${brandItem?.link}?ref=footer`} key={brandItem?.id}>\n <Text html={brandItem?.icon} className=\"text-[#B6B6BA] hover:text-white\" />\n </Link>\n ))}\n </div>\n </div>\n <ChangeCountry\n country={currentCountry || data?.country}\n className=\"desktop:flex-[316] desktop:block hidden\"\n isMobile={isMobile}\n onChangeCountry={event?.country}\n />\n </div>\n <div className=\"h-px bg-[#3D3E3F]\" />\n <div className=\"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1\">\n <Text\n html={data?.copyright?.label}\n className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n {data?.policy?.policies?.map((policyItem: any) => (\n <Link\n href={`${policyItem?.link}?ref=footer`}\n key={policyItem?.id}\n className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#B6B6BA] no-underline\"\n >\n {policyItem?.label}\n </Link>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\nconst MainNavMenu = ({ title, lists, className }: { title: string; lists: any[]; className?: string }) => {\n const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n const [isMobile, setIsMobile] = useState(false)\n\n const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\n\n return (\n <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n <div className=\"flex items-center justify-between\" onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n <Text as=\"p\" html={title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n {isMobile && (\n <>{mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}</>\n )}\n </div>\n {((mainNavMenuOpen && isMobile) || !isMobile) && (\n <div className=\"mt-4 flex flex-col gap-2\">\n {lists?.map((item: any) => (\n <Link href={`${item?.link}?ref=footer`} key={item?.id} className=\"no-underline\">\n <Text\n html={item?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n />\n </Link>\n ))}\n </div>\n )}\n </div>\n )\n}\n\n/**\n * DownloadApp \u4E0B\u8F7D\u5E94\u7528\u6A21\u5757\n * @param title\n * @param apps\n * @param className\n * @returns\n */\nconst DownloadApp = ({ title, apps, className }: { title: string; apps: any[]; className?: string }) => {\n if (!apps?.length) return null\n return (\n <div className={className}>\n <Text html={title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n <div className=\"mt-4 flex items-center gap-4\">\n {apps?.map((appItem: any) => (\n <div key={appItem?.id} className=\"flex flex-col items-center gap-[6px]\">\n <Link href={appItem?.link}>\n <Picture source={appItem?.icon?.url} alt={appItem?.icon?.alt} className=\"size-10 shrink-0\" />\n </Link>\n {appItem?.label && <Text html={appItem?.label} className=\"text-xs font-bold text-[#999999]\" />}\n </div>\n ))}\n </div>\n </div>\n )\n}\n\n/**\n * ChangeCountry \u5207\u6362\u56FD\u5BB6\u6A21\u5757\n * @param data \u6570\u636E\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @returns\n */\nconst ChangeCountry = ({\n country,\n isMobile,\n className,\n onChangeCountry,\n}: {\n country: any\n isMobile: boolean\n className?: string\n onChangeCountry?: () => void\n}) => {\n return (\n <div\n className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}\n onClick={() => onChangeCountry?.()}\n >\n <div className=\"flex items-center justify-between\">\n <div className=\"flex cursor-pointer items-center gap-2\">\n <CountryIcon width={20} height={20} className=\"shrink-0\" />\n <Text\n as=\"p\"\n html={country?.countryName || country?.country}\n className=\"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white\"\n />\n </div>\n {isMobile && (\n <button>\n <ArrowRightIcon width={20} height={20} />\n </button>\n )}\n </div>\n </div>\n )\n}\n\nexport default withLayout(FooterNavigation)\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { useEffect, useMemo, useState } from 'react'\nimport { Picture, Text, Container, Link } from '../../components/index.js'\nimport Subscribe from '../Subscribe/index.js'\nimport type { FooterNavigationProps } from './types.js'\nimport { FooterNavigationBlockType } from './types.js'\nimport { AddIcon, SubtractIcon, ArrowRightIcon, CountryIcon } from './icons/index.js'\nimport { useMediaQuery } from 'react-responsive'\nimport { cn } from '../../helpers/utils.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nconst FooterNavigation = ({\n data: { footerNavigation } = {},\n currentCountry,\n event,\n subscribeLoading,\n}: FooterNavigationProps) => {\n const [isMobile, setIsMobile] = useState(false)\n\n const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\n\n const country = useMemo(() => {\n return (\n footerNavigation?.footerBlocks?.find((block: any) => block?.blockType === FooterNavigationBlockType.Brand)\n ?.country || {}\n )\n }, [footerNavigation])\n\n return (\n <Container childClassName=\"bg-black py-8 laptop:py-16 flex flex-col desktop:gap-16 gap-8\">\n <Text html={footerNavigation?.story} className=\"desktop:text-sm text-xs font-bold text-[#6D6D6F]\" />\n {footerNavigation?.footerBlocks?.map((block: any) => {\n if (block?.blockType === FooterNavigationBlockType.Signup) {\n return <MarketingConversion subscribeLoading={subscribeLoading} data={block} onSubmit={event?.signup} />\n }\n if (block?.blockType === FooterNavigationBlockType.Brand) {\n return <FooterBrand data={block} isMobile={isMobile} event={event} currentCountry={currentCountry} />\n }\n if (block?.blockType === FooterNavigationBlockType.Main) {\n return (\n <MainServices\n data={{ ...block, country }}\n event={event}\n isMobile={isMobile}\n currentCountry={currentCountry}\n />\n )\n }\n })}\n </Container>\n )\n}\n\n/**\n * MarketingConversion \u8425\u9500\u8F6C\u5316\u6A21\u5757\n * @param data\n * @param onSubmit signup\u63D0\u4EA4\u4E8B\u4EF6\n * @returns\n */\nconst MarketingConversion = ({ data, onSubmit, subscribeLoading }: { data: any; onSubmit?: (params: any) => void; subscribeLoading?: boolean }) => {\n return (\n <div className=\"desktop:py-16 desktop:gap-16 laptop:px-8 desktop:flex-row flex flex-col gap-8 rounded-btn bg-[#1D1D1F] px-4 py-8\">\n <Subscribe\n subscribeMetadata={data?.signup}\n className=\"desktop:flex-[744]\"\n onSubmit={onSubmit}\n loading={subscribeLoading}\n />\n <div className=\"desktop:hidden h-px w-full bg-[#3D3E3F]\" />\n <div className=\"desktop:gap-6 laptop:flex-row desktop:flex-[792] flex flex-col gap-4\">\n <div className=\"flex-1\">\n <Text html={data?.enjoy?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n <div className=\"mt-4 flex flex-col gap-2\">\n {data?.enjoy?.enjoys?.map((enjoyItem: any) => (\n <div key={enjoyItem?.id} className=\"flex-start flex gap-2\">\n <Picture source={enjoyItem?.icon?.url} alt={enjoyItem?.icon?.alt} className=\"size-5 shrink-0\" />\n <Text\n html={enjoyItem?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA]\"\n />\n </div>\n ))}\n </div>\n </div>\n <div className=\"w-px bg-[#3D3E3F] hidden desktop:block\" />\n <div className=\"flex-1\">\n <Text html={data?.benefit?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n <div className=\"mt-4 flex flex-col gap-2\">\n {data?.benefit?.benefits?.map((benefitItem: any) => (\n <Link\n href={`${benefitItem?.link}?ref=footer`}\n asChild={!benefitItem?.link}\n key={benefitItem?.id}\n className=\"no-underline\"\n >\n <Text\n html={benefitItem?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n />\n </Link>\n ))}\n </div>\n </div>\n </div>\n </div>\n )\n}\n\n/**\n * MainServices \u4E3B\u5BFC\u822A\u4E0E\u670D\u52A1\u6A21\u5757\n * @param services \u670D\u52A1\n * @param mainNav \u4E3B\u5BFC\u822A\n * @param event \u4E8B\u4EF6\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @param currentCountry \u5F53\u524D\u56FD\u5BB6\n * @returns\n */\nconst MainServices = ({\n data,\n event,\n isMobile,\n currentCountry,\n}: {\n data: any\n event: any\n isMobile: boolean\n currentCountry: any\n}) => {\n const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n const { services, mainNav, country } = data\n return (\n <div className=\"flex flex-col gap-8\">\n <div\n className={cn({\n 'desktop:gap-16 flex': services?.download?.title,\n })}\n >\n <div\n className={cn('w-full', {\n 'desktop:flex-[1260]': services?.download?.title,\n })}\n >\n <Text html={services?.storeBenefits?.title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n <div\n className={cn('laptop:flex-row desktop:gap-4 laptop:flex-wrap mt-4 flex flex-col gap-2', {\n 'desktop:max-w-[648px]': services?.download?.title,\n })}\n >\n {services?.storeBenefits?.reasons?.map((reasonItem: any) => (\n <div key={reasonItem?.id} className=\"desktop:min-w-[288px] flex flex-1 shrink-0 items-center gap-2\">\n <Picture source={reasonItem?.icon?.url} alt={reasonItem?.icon?.alt} className=\"size-5 shrink-0\" />\n <Link href={`${reasonItem?.link}?ref=footer`} asChild={!reasonItem?.link} className=\"no-underline\">\n <Text\n html={reasonItem?.label}\n className=\"text-sm desktop:text-base font-bold leading-[1.2] text-[#B6B6BA]\"\n />\n </Link>\n </div>\n ))}\n </div>\n </div>\n <DownloadApp\n className={cn({\n 'desktop:flex-[404] hidden desktop:block': services?.download?.title,\n })}\n title={services?.download?.title}\n apps={services?.download?.apps}\n />\n </div>\n <div className=\"desktop:block hidden h-px bg-[#3D3E3F]\" />\n <div className=\"desktop:grid grid-cols-4 gap-4\">\n <MainNavMenu title={mainNav?.products?.title} lists={mainNav?.products?.products} />\n <MainNavMenu title={mainNav?.explore?.title} lists={mainNav?.explore?.explores} />\n <MainNavMenu title={mainNav?.support?.title} lists={mainNav?.support?.supports} />\n <div className=\"desktop:py-0 desktop:border-none border-t border-[#3D3E3F] pt-4\">\n <div className=\"desktop:pb-0 flex items-center justify-between pb-4\">\n <Text as=\"p\" html={mainNav?.contact?.title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n {isMobile && (\n <button onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n {mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}\n </button>\n )}\n </div>\n {((mainNavMenuOpen && isMobile) || !isMobile) && (\n <div className=\"desktop:mt-4 desktop:mb-0 mb-4 flex flex-col gap-2\">\n {mainNav?.contact?.contacts?.map((contactItem: any) => (\n <div key={contactItem?.id} className=\"flex items-start gap-2\">\n <Picture source={contactItem?.icon?.url} alt={contactItem?.icon?.alt} className=\"size-5 shrink-0\" />\n <Link href={contactItem?.link} className=\"no-underline\">\n <Text\n html={contactItem?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n />\n </Link>\n </div>\n ))}\n </div>\n )}\n <ChangeCountry\n country={currentCountry || country}\n className=\"desktop:hidden border-b border-[#3D3E3F]\"\n isMobile={isMobile}\n onChangeCountry={event?.country}\n />\n <div className=\"desktop:hidden mt-8\">\n <DownloadApp title={services?.download?.title} apps={services?.download?.apps} />\n </div>\n {!!mainNav?.socials?.length && (\n <div className=\"mt-8 flex items-center gap-2\">\n {mainNav?.socials?.map((socialItem: any) => (\n <Link href={`${socialItem?.link}?ref=footer`} key={socialItem?.id}>\n <Picture source={socialItem?.icon?.url} alt={socialItem?.icon?.alt} className=\"size-8 shrink-0\" />\n </Link>\n ))}\n </div>\n )}\n <div className=\"mt-4 flex flex-wrap gap-2\">\n {mainNav?.payment?.map((paymentItem: any) => (\n <Link href={paymentItem?.link} key={paymentItem?.id}>\n <Picture\n source={paymentItem?.icon?.url}\n alt={paymentItem?.icon?.alt}\n className=\"h-[28px] w-[44px] shrink-0\"\n />\n </Link>\n ))}\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nconst FooterBrand = ({\n data,\n isMobile,\n event,\n currentCountry,\n}: {\n data: any\n isMobile: boolean\n event: any\n currentCountry: any\n}) => {\n return (\n <div className=\"flex flex-col gap-4\">\n <div className=\"desktop:items-center desktop:flex desktop:gap-4\">\n <div className=\"laptop:flex-row laptop:items-center desktop:flex-[980] flex flex-col items-start gap-4\">\n <Text html={data?.brand?.currentBrand} className=\"text-[#B6B6BA]\" />\n <div className=\"laptop:block hidden h-[20px] w-px bg-[#B6B6BA] laptop:mb-[10px]\" />\n <div className=\"desktop:gap-6 flex flex-wrap items-center gap-4\">\n {data?.brand?.brands?.map((brandItem: any) => (\n <Link href={`${brandItem?.link}?ref=footer`} key={brandItem?.id}>\n <Text html={brandItem?.icon} className=\"text-[#B6B6BA] hover:text-white\" />\n </Link>\n ))}\n </div>\n </div>\n <ChangeCountry\n country={currentCountry || data?.country}\n className=\"desktop:flex-[316] desktop:block hidden\"\n isMobile={isMobile}\n onChangeCountry={event?.country}\n />\n </div>\n <div className=\"h-px bg-[#3D3E3F]\" />\n <div className=\"laptop:flex-row desktop:gap-4 desktop:items-center flex flex-col items-start gap-1\">\n <Text\n html={data?.copyright?.label}\n className=\"desktop:text-base text-xs font-bold leading-[1.4] text-[#6D6D6F]\"\n />\n <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n {data?.policy?.policies?.map((policyItem: any) => (\n <Link\n href={`${policyItem?.link}?ref=footer`}\n key={policyItem?.id}\n className=\"desktop:text-base text-xs font-bold hover:text-white leading-[1.4] text-[#B6B6BA] no-underline\"\n >\n {policyItem?.label}\n </Link>\n ))}\n </div>\n </div>\n </div>\n )\n}\n\nconst MainNavMenu = ({ title, lists, className }: { title: string; lists: any[]; className?: string }) => {\n const [mainNavMenuOpen, setMainNavMenuOpen] = useState<boolean>(false)\n const [isMobile, setIsMobile] = useState(false)\n\n const mediaQuery = useMediaQuery({ query: '(max-width: 1439px)' })\n\n useEffect(() => {\n setIsMobile(mediaQuery)\n }, [mediaQuery])\n\n return (\n <div className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}>\n <div className=\"flex items-center justify-between\" onClick={() => setMainNavMenuOpen(!mainNavMenuOpen)}>\n <Text as=\"p\" html={title} className=\"text-xl font-bold leading-[1.2] text-white\" />\n {isMobile && (\n <>{mainNavMenuOpen ? <SubtractIcon width={20} height={20} /> : <AddIcon width={20} height={20} />}</>\n )}\n </div>\n {((mainNavMenuOpen && isMobile) || !isMobile) && (\n <div className=\"mt-4 flex flex-col gap-2\">\n {lists?.map((item: any) => (\n <Link href={`${item?.link}?ref=footer`} key={item?.id} className=\"no-underline\">\n <Text\n html={item?.label}\n className=\"desktop:text-base text-sm font-bold leading-[1.2] text-[#B6B6BA] hover:text-white\"\n />\n </Link>\n ))}\n </div>\n )}\n </div>\n )\n}\n\n/**\n * DownloadApp \u4E0B\u8F7D\u5E94\u7528\u6A21\u5757\n * @param title\n * @param apps\n * @param className\n * @returns\n */\nconst DownloadApp = ({ title, apps, className }: { title: string; apps: any[]; className?: string }) => {\n if (!apps?.length) return null\n return (\n <div className={className}>\n <Text html={title} className=\" text-xl font-bold leading-[1.2] text-white\" />\n <div className=\"mt-4 flex items-center gap-4\">\n {apps?.map((appItem: any) => (\n <div key={appItem?.id} className=\"flex flex-col items-center gap-[6px]\">\n <Link href={appItem?.link}>\n <Picture source={appItem?.icon?.url} alt={appItem?.icon?.alt} className=\"size-10 shrink-0\" />\n </Link>\n {appItem?.label && <Text html={appItem?.label} className=\"text-xs font-bold text-[#999999]\" />}\n </div>\n ))}\n </div>\n </div>\n )\n}\n\n/**\n * ChangeCountry \u5207\u6362\u56FD\u5BB6\u6A21\u5757\n * @param data \u6570\u636E\n * @param isMobile \u662F\u5426\u662F\u79FB\u52A8\u7AEF\n * @returns\n */\nconst ChangeCountry = ({\n country,\n isMobile,\n className,\n onChangeCountry,\n}: {\n country: any\n isMobile: boolean\n className?: string\n onChangeCountry?: () => void\n}) => {\n return (\n <div\n className={cn('desktop:py-0 desktop:border-none border-t border-[#3D3E3F] py-4', className)}\n onClick={() => onChangeCountry?.()}\n >\n <div className=\"flex items-center justify-between\">\n <div className=\"flex cursor-pointer items-center gap-2\">\n <CountryIcon width={20} height={20} className=\"shrink-0\" />\n <Text\n as=\"p\"\n html={country?.countryName || country?.country}\n className=\"desktop:text-[#B6B6BA] text-base font-bold leading-[1.4] text-white hover:text-white\"\n />\n </div>\n {isMobile && (\n <button>\n <ArrowRightIcon width={20} height={20} />\n </button>\n )}\n </div>\n </div>\n )\n}\n\nexport default withLayout(FooterNavigation)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["FooterNavigation_exports", "__export", "FooterNavigation_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_components", "import_Subscribe", "import_types", "import_icons", "import_react_responsive", "import_utils", "import_Styles", "FooterNavigation", "footerNavigation", "currentCountry", "event", "subscribeLoading", "isMobile", "setIsMobile", "mediaQuery", "country", "block", "MarketingConversion", "FooterBrand", "MainServices", "data", "onSubmit", "Subscribe", "enjoyItem", "benefitItem", "mainNavMenuOpen", "setMainNavMenuOpen", "services", "mainNav", "reasonItem", "DownloadApp", "MainNavMenu", "contactItem", "ChangeCountry", "socialItem", "paymentItem", "brandItem", "policyItem", "title", "lists", "className", "item", "apps", "appItem", "onChangeCountry"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var me=Object.create;var G=Object.defineProperty;var pe=Object.getOwnPropertyDescriptor;var be=Object.getOwnPropertyNames;var fe=Object.getPrototypeOf,ve=Object.prototype.hasOwnProperty;var ge=(t,n)=>{for(var o in n)G(t,o,{get:n[o],enumerable:!0})},Z=(t,n,o,c)=>{if(n&&typeof n=="object"||typeof n=="function")for(let r of be(n))!ve.call(t,r)&&r!==o&&G(t,r,{get:()=>n[r],enumerable:!(c=pe(n,r))||c.enumerable});return t};var K=(t,n,o)=>(o=t!=null?me(fe(t)):{},Z(n||!t||!t.__esModule?G(o,"default",{value:t,enumerable:!0}):o,t)),he=t=>Z(G({},"__esModule",{value:!0}),t);var He={};ge(He,{default:()=>Ee});module.exports=he(He);var e=require("react/jsx-runtime"),a=K(require("react")),l=require("../../components/index.js"),se=require("../../shared/Styles.js"),k=require("../../helpers/utils.js"),B=K(require("./NavProvider.js")),x=require("./types.js"),$e=require("react-responsive"),ie=require("es-toolkit"),ce=K(require("jump.js")),J=require("@gsap/react"),V=require("gsap"),T=require("./withCategory.js"),P=require("./icons/index.js"),de=K(require("../NavigationSearch/index.js"));const ye=(0,a.forwardRef)((t,n)=>{const{data:{headerNavigation:o}={},buildProps:c,event:r,profile:f,theme:u="light",isTop:m=!1,searchResult:d,onSearch:w,isSearching:i,keywords:C,onPrimaryNavClick:N,onSeriesProductClick:v,onSidebarNavClick:g,headerId:h,cartCount:p}=t,s=(0,a.useRef)(null),[b,S]=(0,a.useState)(!1),[D,z]=(0,a.useState)(!1),[L,j]=(0,a.useState)(!1),[_,M]=(0,a.useState)(!1),$=(0,a.useRef)(null),R=()=>{const F=document?.querySelector("body")?.offsetWidth||0;M(F<=1440)};(0,a.useEffect)(()=>(R(),window.addEventListener("resize",R),()=>{window.removeEventListener("resize",R)}),[]),(0,a.useImperativeHandle)(n,()=>$.current),(0,a.useEffect)(()=>{$.current&&m&&(0,ce.default)($.current,{duration:0,offset:$.current?.getBoundingClientRect()?.bottom||0})},[m]),(0,a.useEffect)(()=>{r&&(r.search=()=>S(!0))},[r]),(0,J.useGSAP)(()=>{s?.current&&b&&V.gsap.fromTo(s.current,{height:0},{height:"auto",duration:.3})},[b]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=b?"hidden":"auto"},[b]);const q=(0,a.useMemo)(()=>o?.headerBar?.actions?.find(F=>F?.blockType===x.HeaderNavigationActionBlockType.Search)?.searchBar?.[0]||{},[o]);return(0,e.jsx)(B.default,{buildProps:c,profile:f,isMobile:_,event:r,payloadData:o,onSidebarNavClick:g,onSeriesProductClick:v,cartCount:p,children:(0,e.jsx)("header",{id:h||"header","data-ui-component-id":"HeaderNavigation",className:"relative z-[100]",ref:$,children:(0,e.jsxs)("div",{className:(0,k.cn)("hover:text-black hover:bg-white",u==="light"?"text-black":"text-white",{}),onClick:()=>j(!0),children:[(0,e.jsx)(xe,{data:o,className:"hidden desktop:block",theme:u,onNavItemClick:()=>j(!0),onPrimaryNavClick:N}),(0,e.jsx)(Ce,{data:o,className:"block desktop:hidden",onPrimaryNavClick:N}),b&&(0,e.jsxs)("div",{className:"absolute z-[60] top-0 left-0 w-full bg-black/70 flex flex-col",style:{height:`calc(100dvh - ${$?.current?.getBoundingClientRect()?.top}px)`},children:[(0,e.jsx)("div",{ref:s,className:(0,k.cn)("overflow-y-auto",{}),children:(0,e.jsx)(de.default,{data:q,keywords:C,isSearching:i,searchResult:d,onSearch:F=>{w?.(F)},onClose:()=>{w?.(),S(!1)}})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>S(!1)})]})]})})})}),xe=(0,a.forwardRef)((t,n)=>{const{data:o,onNavItemClick:c,className:r,theme:f,onPrimaryNavClick:u}=t,{event:m,profile:d}=(0,B.useNavContext)(),[w,i]=(0,a.useState)(!1),C=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(o?.categories?.filter(y=>y?.pcShow)),[o]),[N,v]=(0,a.useState)(null),[g,h]=(0,a.useState)([]),p=(0,a.useRef)(null),[s,b]=(0,a.useState)(!1),S=(0,a.useRef)(null),D=(0,a.useRef)(null),z=(0,a.useRef)(C.map(y=>Array(y?.length||0).fill(null)));(0,a.useEffect)(()=>{C?.length&&h(C?.map((y,E)=>y?.map((H,A)=>({groupIndex:E,index:A,open:!1}))))},[C]);const L=(0,a.useMemo)(()=>{let y=null;for(const E of g){for(const H of E)if(H.open){y=H;break}if(y)break}return y},[g]);(0,a.useEffect)(()=>{document.documentElement.style.overflow=L?.open||s?"hidden":"auto"},[L?.open,s]);const j=(y,E,H)=>{if(b(!1),N?.components?.[0]?.blockType===x.HeaderNavigationBlockType.Links)N?.components?.[0]?.url&&window.open(N?.components?.[0]?.url);else{const A=C?.flat()||[],I=A?.findIndex(Y=>Y?.id===C[E][H]?.id);y.stopPropagation(),c?.(),u?.(A[I],I),v(C[E][H]),h(Y=>Y.map(ue=>ue.map(W=>W.groupIndex===E&&W.index===H?{...W,open:!W.open}:{...W,open:!1})))}},_=()=>{h(y=>y.map(E=>E.map(H=>({...H,open:!1}))))},M=(0,a.useMemo)(()=>{if(N)return N?.components?.[0]?.blockType},[N]),$=(0,T.WithSidebar)(Ne,N),R=(0,T.WithMulticol)(ke,N),q=(0,T.WithSupports)(we,{categoriesItem:N,currentNavItemRef:z.current?.[L?.groupIndex||0]?.[L?.index||0]}),F=(0,a.useMemo)(()=>{switch(M){case x.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)($,{});case x.HeaderNavigationBlockType.Supports:return(0,e.jsx)(q,{});case x.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(R,{});default:return null}},[M,N]),Q=(0,a.useMemo)(()=>o?.headerBar?.actions?.filter(y=>y?.pcShow),[o]),O=(0,a.useMemo)(()=>Q?.find(y=>y?.blockType===x.HeaderNavigationActionBlockType.Profile),[Q]),X=(0,a.useCallback)(()=>{b(y=>!y)},[]);return(0,a.useEffect)(()=>{if(p?.current){const y=p.current;return y.addEventListener("click",X),()=>{y.removeEventListener("click",X)}}},[X]),(0,J.useGSAP)(()=>{L?.open&&V.gsap.fromTo(D?.current,{height:0},{height:"auto"})},[L?.open]),(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[96px]",r),children:[(0,e.jsxs)("div",{ref:S,onClick:_,className:"flex h-full flex-col justify-end gap-4",children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsx)(le,{}),(0,e.jsx)(oe,{ref:p,actions:Q,activeStatus:s})]}),(0,e.jsx)("div",{className:"flex justify-between",children:C?.map((y,E)=>(0,e.jsx)("div",{className:"flex gap-3",children:y?.map((H,A)=>(0,e.jsx)("div",{ref:I=>{z.current[E][A]=I},className:"group cursor-pointer",children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsxs)("div",{className:"flex items-center gap-1 pb-4",onClick:I=>j(I,E,A),children:[(0,e.jsx)(l.Text,{html:H.text,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("opacity-0 size-4 group-hover:opacity-100 transition-opacity duration-500",{"rotate-180":L?.groupIndex===E&&L?.index===A,"opacity-100":w&&L?.groupIndex===E&&L?.index===A})})]}),(0,e.jsx)("div",{className:(0,k.cn)("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":L?.groupIndex===E&&L?.index===A},f==="dark"?"bg-white":"bg-[#1D1D1F]")})]})},H.id))},`groupCategory-${E}`))})]}),(0,e.jsxs)("div",{className:(0,k.cn)("border-t border-b-[#E4E5E6] text-black absolute left-0 top-full z-[999] flex w-full flex-col bg-black/70 overflow-hidden",{hidden:!(L?.open&&N)}),onMouseEnter:()=>i(!0),onMouseLeave:()=>i(!1),style:{height:`calc(100dvh - ${S?.current?.getBoundingClientRect()?.bottom}px)`},children:[(0,e.jsx)("div",{ref:D,className:(0,k.cn)("relative z-50",{"overflow-hidden":M!==x.HeaderNavigationBlockType.Supports}),children:F}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:_})]}),s&&(0,e.jsxs)("div",{className:"absolute left-0 z-[999] flex w-full bg-black/70 h-[100dvh] top-full",children:[(0,e.jsx)("div",{className:"absolute w-[272px] bg-white p-4",style:{right:`calc(100% - ${p?.current?.getBoundingClientRect()?.right}px)`,top:"-36px"},children:d?.email?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:d?.nick_name||O?.welcome,className:"text-sm font-bold"}),(0,e.jsx)("div",{className:"h-[1px] mt-2 bg-[#D9D9D9]"}),(0,e.jsx)("div",{className:"mt-2",children:O?.profiles?.map(y=>(0,e.jsx)(U,{className:"py-2",label:y?.title,href:y?.url},y.id))})]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P.Polygon,{className:"absolute -top-2 text-white right-[46px] z-30"}),(0,e.jsx)(l.Text,{html:O?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:O?.benefits?.map(y=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:y.benefitIcon?.url,className:"size-4",alt:y.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:y.benefit,className:"text-sm font-bold leading-[1.4]"})]},y.id))}),(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-2",children:[(0,e.jsx)(l.Button,{variant:"secondary",size:"lg",onClick:()=>m?.join?.(),children:(0,e.jsx)(l.Text,{html:O?.primaryButton||"Join Now",className:"font-bold"})}),(0,e.jsx)(l.Button,{variant:"primary",size:"lg",onClick:()=>m?.login?.(),children:(0,e.jsx)(l.Text,{html:O?.secondaryButton||"Log In",className:"font-bold"})})]})]})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>b(!1)})]})]})}),Ne=a.default.memo(({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{buildProps:o,onSidebarNavClick:c}=(0,B.useNavContext)(),[r,f]=(0,a.useState)([]),[u,m]=(0,a.useState)(-1),d=(0,a.useRef)(null),w=(0,a.useCallback)(()=>{const v=t?.subcategories;if(!v?.length)return;const g=v.findIndex(s=>!!s?.subSubCategories),h=v.findIndex(s=>!s?.subSubCategories),p=v.map((s,b)=>({index:b,open:g===b||h===b}));f(p)},[t]);(0,a.useEffect)(()=>{w()},[w]);const i=(0,a.useMemo)(()=>{const v=t?.subcategories?.[r?.find(h=>h.open)?.index||0],g=n?.find(h=>h?.label?.toLowerCase()===v?.label?.toLowerCase())||{};if(v?.collections){const h=o?.categories?.[v?.collections]||{};return{label:g?.label,isCollection:!0,banner:g?.banner,primary:g?.primary,series:[{products:h?.products}]}}else if(v?.subSubCategories){const h=v?.subSubCategories?.[u],p=n?.find(s=>s?.label?.toLowerCase()===h?.label?.toLowerCase())||{};if(h?.collections){const s=o?.categories?.[h?.collections]||{};return{label:p?.label,isCollection:!0,banner:p?.banner,primary:p?.primary,series:[{products:s?.products}]}}else return p}else return g},[t,r,u,n]),C=(0,a.useCallback)((v,g)=>{if(g?.subSubCategories?.length>0?m(0):m(-1),g?.subSubCategories?.length>0)f(h=>h.map(p=>p.index===v?{...p,open:!0}:{...p,open:!1}));else{const p=t?.subcategories?.findIndex(s=>!!s?.subSubCategories);f(s=>s.map(b=>({...b,open:b.index===v||b.index===p})))}},[t,w]),N=(v,g)=>{f(h=>h.map(p=>p.index===v?{...p,open:!0}:{...p,open:!1})),m(g)};return(0,e.jsxs)(l.Container,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[(0,e.jsxs)("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:d,children:[(0,e.jsx)("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:t?.subcategories?.map((v,g)=>{const h=Array.isArray(v?.subSubCategories)&&v?.subSubCategories?.length>0;return(0,e.jsxs)("div",{children:[(0,e.jsxs)("div",{className:(0,k.cn)("flex cursor-pointer items-center justify-between",{"bg-[#F5F5F7]":!h&&r?.find(p=>p.index===g)?.open}),onClick:()=>{C(g,v),c?.(v,g)},children:[(0,e.jsx)(l.Text,{html:v.label,className:"p-4 text-sm font-bold leading-[1.4]"}),h&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-4",{"rotate-180":r?.find(p=>p.index===g)?.open})})]}),r?.find(p=>p.index===g)?.open&&(0,e.jsx)("div",{className:"flex flex-col",children:v.subSubCategories?.map((p,s)=>(0,e.jsx)(l.Text,{html:p.label,onClick:()=>{N(g,s),c?.(p,s)},className:(0,k.cn)("cursor-pointer hover:bg-[#F5F5F7] px-6 py-4 text-sm font-bold leading-[1.4] text-[#6D6D6F]",{"bg-[#F5F5F7]":u===s})},`subSubItem-${g}-${s}`))})]},`subcategoryItem-${g}`)})}),t&&(0,e.jsx)("div",{className:"flex",children:(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"text-sm lg-desktop:text-base",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"justify-start !p-0 text-sm lg-desktop:text-base",children:t?.secondary?.label})]})})]}),(0,e.jsxs)("div",{className:"flex-1 py-4",children:[Reflect.ownKeys(i).length>0&&(0,e.jsxs)("div",{className:"mb-4 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)(l.Text,{html:i?.label,className:"text-xl lg-desktop:text-2xl font-bold leading-[1.4]"}),i?.primary&&!i?.primary?.hide&&(0,e.jsx)(l.Button,{as:"a",href:`${i?.primary?.url}?ref=${i?.label}_viewmore`,variant:"link",size:"lg",className:"justify-start !p-0 text-sm lg-desktop:text-base font-bold leading-[1.2] no-underline",children:i?.primary?.label})]}),(0,e.jsx)(l.Link,{href:i?.guide?.url,className:"text-sm lg-desktop:text-base leading-[1.2] text-[#6D6D6F]",children:i?.guide?.label})]}),(0,e.jsx)("div",{className:"flex flex-col gap-4 overflow-y-auto h-[426px]",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:i?.series?.map((v,g)=>(0,e.jsxs)("div",{children:[v.label&&(0,e.jsx)(l.Text,{html:v.label,className:"text-sm mb-2 font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"grid grid-cols-3 gap-4",children:[!!i?.banner&&(0,e.jsx)(l.Link,{asChild:!i?.banner?.href,href:i?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-600",children:[(0,e.jsx)(l.Picture,{source:i?.banner?.imageUrl,className:"h-[114px] laptop:h-[120px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute bottom-0 left-0 right-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:i?.banner?.title||"Buy in Guide",className:"font-bold text-white"}),(0,e.jsx)(l.Text,{html:i?.banner?.desc||"20.000mAh",className:"text-sm text-white font-bold"})]})]})}),v.products?.map((h,p)=>(0,e.jsx)(ee,{seriesLabel:i?.label,product:h,isCollection:i?.isCollection},`seriesProductItem-${p}`))]})]},`seriesItem-${g}`))})]})]})}),ke=({multicolMetadata:t})=>{const n=(0,a.useRef)(null);return(0,e.jsx)("div",{ref:n,children:(0,e.jsx)(l.Container,{childClassName:"bg-white",className:"h-full",children:(0,e.jsx)("div",{className:"flex gap-4 py-4",children:t?.map((o,c)=>(0,e.jsx)("div",{className:"w-1/4",children:(0,e.jsx)(te,{item:o})},`multicolItem-${o?.label}-${c}`))})})})},we=({supportsMetadata:t,currentNavItemRef:n})=>{const o=(0,a.useRef)(null),[c,r]=(0,a.useState)(null),[f,u]=(0,a.useState)(0);(0,a.useEffect)(()=>{if(o?.current){const d=o?.current?.getBoundingClientRect();u(d.height)}},[o]);const m=(0,ie.debounce)(()=>{if(n){const d=n.getBoundingClientRect();r(d)}},500);return(0,a.useEffect)(()=>(m(),window.addEventListener("resize",m),()=>{window.removeEventListener("resize",m)}),[m]),(0,a.useEffect)(()=>{if(n){const d=n.getBoundingClientRect();r(d)}},[n]),(0,e.jsx)("div",{className:"absolute top-0 h-full bg-white transition-all duration-500 overflow-hidden",style:{right:`calc(100% - ${c?.right}px)`,height:f},children:(0,e.jsx)("div",{ref:o,className:"p-4",children:t?.map(d=>(0,e.jsx)("div",{className:"py-2",children:(0,e.jsx)(l.Link,{href:d.url,className:"text-sm font-bold leading-[1.4] no-underline",children:d.label})},d.id))})})},ee=({product:t,isCollection:n,position:o,seriesLabel:c})=>{const{buildProps:r,onSeriesProductClick:f}=(0,B.useNavContext)();let u=n?t:r?.products?.find(i=>i.handle===t.handle);const m=u?.variants?.find(i=>i.sku===t.sku)||u?.variants?.[0],d=(0,a.useMemo)(()=>`/products/${u?.handle}?variant=${(0,k.atobID)(m?.id)}`,[u?.handle,m?.id]),w=(0,a.useMemo)(()=>u?.tags?.filter?.(i=>i?.startsWith?.("CLtag"))?.map?.(i=>i?.replace?.("CLtag:",""))?.slice?.(0,2),[u?.tags]);return m?.availableForSale?(0,e.jsxs)("div",{className:"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110",children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)(l.Picture,{source:`${m?.image?.url||t?.images?.[0]?.url}}`,width:90,height:90,className:"size-[96px]",imgClassName:"object-contain h-full"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:"flex gap-1",children:Array.isArray(w)&&w?.map(i=>(0,e.jsx)(l.Text,{as:"p",html:i,className:"text-brand-0 whitespace-nowrap mb-1 inline-block h-[24px] rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]"}))}),(0,e.jsx)(l.Link,{href:d,onClick:i=>{i.preventDefault(),window.open(d),f?.(u,o||0,c)},className:"no-underline hover:text-current",children:(0,e.jsx)(l.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:u?.title||t?.name})}),t?.desc&&(0,e.jsx)(l.Text,{as:"p",html:t?.desc,className:"lg-desktop:text-sm line-clamp-1 mt-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]}):null},te=({item:t,allPicture:n})=>(0,e.jsxs)(e.Fragment,{children:[t?.columns&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:t.label,as:"div",className:"my-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col",children:t.columns?.map(o=>(0,e.jsxs)("div",{className:"py-2 flex items-center gap-1",children:[(0,e.jsx)(l.Link,{href:`${o.url}?ref=navMenu`,asChild:!o.url,className:"text-sm font-bold leading-[1.4] no-underline",children:o.label}),o?.badge&&(0,e.jsx)(l.Text,{as:"p",html:o?.badge||"badge",className:"text-sm font-bold !leading-[22px] text-brand-0 h-[24px] rounded-full border-[1.6px] border-[var(--brand-color-0)] px-[6px]"})]},o.label))})]}),t?.imageUrl&&(0,e.jsx)("div",{className:(0,k.cn)("laptop:h-[280px] desktop:h-[224px] lg-desktop:h-[280px] h-[240px] max-w-[358px] tablet:max-w-[346px] laptop:max-w-[440px] desktop:w-full relative overflow-hidden",{"tablet:max-w-none laptop:max-w-none":n}),children:(0,e.jsxs)(l.Link,{href:`${t.url}?ref=navMenu`,asChild:!t.url,children:[(0,e.jsx)(l.Picture,{source:t.imageUrl,width:404,height:280,className:"size-full",imgClassName:"object-cover h-full hover:scale-105 transition-all duration-300"}),(0,e.jsxs)("div",{className:"absolute bottom-4 left-4 z-10 flex flex-col justify-end no-underline",children:[(0,e.jsx)(l.Text,{html:t.title,className:(0,k.cn)("lg-desktop:text-2xl text-xl font-bold leading-[1.2] text-white",{"text-black":t?.theme==="dark"})}),t.subtitle&&(0,e.jsx)(l.Text,{html:t.subtitle,className:(0,k.cn)("text-sm font-bold leading-[1.4] text-white",{"text-black":t?.theme==="dark"})}),t?.primary?.label&&(0,e.jsx)(l.Button,{as:"a",href:t?.primary?.url,variant:"link",size:"lg",className:(0,k.cn)("text-sm font-bold mr-auto !p-0 leading-[1.4] text-white",{"text-black":t?.theme==="dark"}),children:t?.primary?.label||"more"})]})]})})]}),Ce=(0,a.forwardRef)(({data:t,className:n,onPrimaryNavClick:o},c)=>{const r=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(t?.categories?.filter(M=>M?.mobileShow)),[t]),{currentMenu:f,setCurrentMenu:u,subSubCategory:m}=(0,B.useNavContext)(),[d,w]=(0,a.useState)(!1),[i,C]=(0,a.useState)(0),[N,v]=(0,a.useState)(null),g=(0,a.useRef)(null);(0,a.useEffect)(()=>{if(g?.current&&d){const M=g?.current?.getBoundingClientRect();C(window?.innerHeight-(M?.bottom||0))}},[d]),(0,J.useGSAP)(()=>{V.gsap.fromTo(g.current,{height:0},{height:i,duration:.3})},[i]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=d?"hidden":"auto"},[d]);const h=(0,a.useMemo)(()=>N?.components?.[0]?.blockType,[N]),p=(0,T.WithSupports)(Le,{categoriesItem:N}),s=(0,T.WithSidebar)(De,N),b=(0,T.WithMulticol)(Me,N),S=(0,a.useMemo)(()=>{switch(h){case x.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(s,{});case x.HeaderNavigationBlockType.Supports:return(0,e.jsx)(p,{});case x.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(b,{});default:return null}},[h,N,p]),D=(0,a.useCallback)(()=>{w(!1),C(0),u&&u(x.HeaderNavigationMenu.Primary)},[w,C,u]),z=(0,a.useMemo)(()=>t?.headerBar?.actions?.filter(M=>M?.mobileShow&&M?.blockType!==x.HeaderNavigationActionBlockType.Profile),[t]),L=(0,a.useMemo)(()=>t?.headerBar?.actions?.find(M=>M?.mobileShow&&M?.blockType===x.HeaderNavigationActionBlockType.Profile)||{},[t]),j=(0,a.useMemo)(()=>{switch(f){case x.HeaderNavigationMenu.Primary:return(0,e.jsx)(ze,{actions:z,menuOpen:d,onMenuOpenClose:()=>{w(!1),C(0)},onMenuOpenClick:()=>w(!0)});case x.HeaderNavigationMenu.Secondary:return(0,e.jsx)(re,{title:N?.text,onMenuOpenClose:D,onMenuBackClick:()=>u?.(x.HeaderNavigationMenu.Primary)});case x.HeaderNavigationMenu.Third:return(0,e.jsx)(re,{title:m?.label,onMenuOpenClose:D,onMenuBackClick:()=>u?.(x.HeaderNavigationMenu.Secondary)});default:return null}},[d,f,u,N,z,m,D]),_=(0,a.useCallback)((M,$)=>{const R=Array.isArray(r)?Array.isArray(r[M])?r[M][$]:{}:{};v(R),R?.components?.[0]?.blockType===x.HeaderNavigationBlockType.Links?R?.components?.[0]?.url&&window.open(R?.components?.[0]?.url):u?.(x.HeaderNavigationMenu.Secondary)},[r,u]);return(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[52px]",n),children:[j,d&&(0,e.jsx)("div",{ref:g,className:"absolute left-0 top-full text-black border-t border-[#E4E5E6] z-[999] w-full overflow-y-auto bg-white",style:{height:i},children:f===x.HeaderNavigationMenu.Primary?(0,e.jsx)(Se,{categories:r,onPrimaryMenuClick:_,onPrimaryNavClick:o,profileAction:L}):S})]})}),Se=({categories:t,onPrimaryMenuClick:n,profileAction:o,onPrimaryNavClick:c})=>{const{onSidebarNavClick:r}=(0,B.useNavContext)();return(0,e.jsxs)("div",{className:"flex h-full flex-col justify-between",children:[(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:t?.map((f,u)=>(0,e.jsxs)("div",{className:"",children:[f?.map((m,d)=>(0,e.jsx)(U,{label:m.text,onClick:()=>{const i=(t?.flat()||[])?.findIndex(C=>C?.id===t[u][d]?.id);n(u,d),c?.(m,i)},icon:m.components?.[0]?.icon},m.id)),(0,e.jsx)("div",{className:(0,k.cn)("my-2 h-px w-full bg-[#E5E5E7]",{hidden:u===t.length-1})})]},`groupCategory-${u}`))}),(0,e.jsx)(Pe,{profileAction:o})]})},De=({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{currentMenu:o,setCurrentMenu:c,subSubCategory:r,setSubSubCategory:f,setCurrentSeriesMetadata:u,currentSeriesMetadata:m,buildProps:d,onSidebarNavClick:w}=(0,B.useNavContext)(),[i,C]=(0,a.useState)([]),[N,v]=(0,a.useState)([]);(0,a.useEffect)(()=>{t?.subcategories?.length&&C(t?.subcategories?.map((s,b)=>({index:b,open:!1})))},[t]),(0,a.useEffect)(()=>{r?.subSubCategories?.length&&v(r?.subSubCategories?.map((s,b)=>({index:b,open:b===0})))},[r]);const g=(0,a.useCallback)((s,b)=>{c&&c(x.HeaderNavigationMenu.Third),f?.(s);const S=n?.find(D=>b!==void 0?s?.subSubCategories?.[b]?.label?.toLowerCase()===D.label?.toLowerCase():s?.label?.toLowerCase()===D.label?.toLowerCase())||{};if(s?.collections){const D=d?.categories?.[s?.collections]||{};u?.({label:S?.label,isCollection:!0,banner:S?.banner,primary:S?.primary,series:[{products:D?.products}]})}else u?.(S)},[n,t,c,f,u]),h=(0,a.useMemo)(()=>n?.find(s=>!!s?.guide)?.guide,[n,t]);return(0,a.useMemo)(()=>{switch(o){case x.HeaderNavigationMenu.Secondary:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 flex h-full flex-col justify-between tablet:justify-start tablet:gap-16 p-4",children:[(0,e.jsx)("div",{children:t?.subcategories?.map((s,b)=>(0,e.jsx)("div",{children:(0,e.jsx)(U,{label:s?.label,active:i.find(S=>S.index===b)?.open,onClick:()=>{g(s),w?.(s,b)}})},`${s.label}-${b}`))}),(0,e.jsxs)("div",{className:"tablet:items-start flex flex-col items-center gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"tablet:w-auto w-full text-base",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"tablet:w-auto tablet:px-0 w-full py-0 text-base",children:t?.secondary?.label})]})]});case x.HeaderNavigationMenu.Third:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:[r?.subSubCategories?r?.subSubCategories?.map((s,b)=>{const S=n?.find(z=>z.label.toLowerCase()===s?.label?.toLowerCase())||{};let D={};if(s?.collections){const z=d?.categories?.[s?.collections]||{};D={label:S?.label,isCollection:!0,banner:S?.banner,primary:S?.primary,series:[{products:z?.products}]}}else D=S;return(0,e.jsxs)("div",{children:[Reflect.ownKeys(s).length>0&&(0,e.jsx)(ae,{matchSeriesMetadata:D,onSubSubCategoryItemClick:()=>{w?.(s,b),v(z=>z.map((L,j)=>({...L,open:j===b?!L.open:L.open})))},expanded:!!N?.find(z=>z.index===b)?.open}),N?.find(z=>z.index===b)?.open&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(ne,{matchSeriesMetadata:D}),D?.primary&&(0,e.jsx)("div",{className:"text-center my-4",children:(0,e.jsx)(l.Button,{as:"a",href:D?.primary?.url,className:"text-base no-underline leading-[1.2]",variant:"secondary",size:"base",children:D?.primary?.label})})]})]},`${s.label}-${b}`)}):(0,e.jsxs)(e.Fragment,{children:[Reflect.ownKeys(m).length>0&&(0,e.jsx)(ae,{matchSeriesMetadata:m}),(0,e.jsx)(ne,{matchSeriesMetadata:m}),m?.primary&&(0,e.jsx)("div",{className:"text-center my-4 ",children:(0,e.jsx)(l.Button,{as:"a",href:`${m?.primary?.url}?ref=${m?.label}_viewmore`,variant:"secondary",size:"base",className:"text-base no-underline leading-[1.2]",children:m?.primary?.label})})]}),h&&(0,e.jsx)(l.Link,{href:h?.url,children:(0,e.jsx)("div",{className:"mt-4",children:(0,e.jsx)(l.Text,{html:h?.label,className:"text-sm font-bold leading-[1.2] text-[#6D6D6F]"})})})]});default:return null}},[o,t,c,n,i,N,f,r,u,m])},ae=({matchSeriesMetadata:t,onSubSubCategoryItemClick:n,expanded:o})=>(0,e.jsxs)("div",{className:"tablet:pt-0 py-4 flex items-center justify-between",onClick:n,children:[t?.label&&(0,e.jsx)(l.Text,{html:t?.label,className:"text-sm font-bold leading-[1.4]"}),n&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-5",{"rotate-180":o})})]}),ne=({matchSeriesMetadata:t})=>(0,e.jsx)("div",{className:"flex flex-col gap-2 laptop:gap-3",children:!!t?.series?.length&&t?.series?.map((n,o)=>(0,e.jsxs)("div",{children:[n.label&&(0,e.jsx)(l.Text,{html:n.label,className:"text-sm mb-2 font-bold leading-[1.4] text-[#3D3D3F]"}),(0,e.jsxs)("div",{className:"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2",children:[!!t?.banner&&(0,e.jsx)(l.Link,{asChild:!t?.banner?.href,href:t?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-600",children:[(0,e.jsx)(l.Picture,{source:t?.banner?.imageUrl,className:"h-[114px] laptop:h-[120px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute bottom-0 left-0 right-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:t?.banner?.title||"Buy in Guide",className:(0,k.cn)("font-bold text-white",{"text-black":t?.banner?.theme==="dark"})}),(0,e.jsx)(l.Text,{html:t?.banner?.desc||"20.000mAh",className:(0,k.cn)("text-sm text-white font-bold",{"text-black":t?.banner?.theme==="dark"})})]})]})}),n.products?.map((c,r)=>(0,e.jsx)(ee,{position:r,product:c,seriesLabel:t?.label,isCollection:t?.isCollection},`seriesProductItem-${o}-${r}`))]})]},`seriesItem-${o}`))}),Le=({supportsMetadata:t})=>(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:t?.map(n=>(0,e.jsx)(U,{href:n.url,label:n.label,onClick:()=>{}},n.id))}),Me=({multicolMetadata:t})=>{const n=(0,a.useMemo)(()=>!t?.some(o=>!!o.columns),[t]);return(0,e.jsx)("div",{className:(0,k.cn)("tablet:py-4 tablet:px-8 laptop:px-16 flex flex-col gap-4 tablet:gap-6 p-4",{"tablet:grid tablet:grid-cols-2 tablet:gap-3 laptop:gap-4":n}),children:t?.map((o,c)=>(0,e.jsx)("div",{children:(0,e.jsx)(te,{item:o,allPicture:n})},`multicolItem-${o?.label}-${c}`))})},Pe=({profileAction:t})=>{const[n,o]=(0,a.useState)(!1),{profile:c,event:r}=(0,B.useNavContext)();return(0,e.jsxs)("div",{className:(0,k.cn)("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":n}),children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",onClick:()=>o(!n),children:[(0,e.jsxs)("div",{className:"flex items-center gap-[14px]",children:[(0,e.jsx)("div",{className:"flex size-[40px] shrink-0 items-center justify-center rounded-full bg-white",children:(0,e.jsx)(P.User,{})}),(0,e.jsx)(l.Text,{html:c?.nick_name||t?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!c?.email&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-5 laptop:size-4",{"rotate-180":n})})]}),c?.email&&(0,e.jsx)("div",{className:"mt-4",children:t?.profiles?.map(f=>(0,e.jsx)(U,{label:f?.title,href:f?.url},f.id))}),n&&!c?.email&&(0,e.jsxs)("div",{className:"mt-4",children:[(0,e.jsx)(l.Text,{html:t?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:t?.benefits?.map(f=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:f.benefitIcon?.url,className:"size-4",alt:f.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:f.benefit,className:"text-sm font-bold leading-[1.4]"})]},f.id))})]}),!c?.email&&(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-3",children:[(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"secondary",size:"base",onClick:()=>r?.join?.(),children:(0,e.jsx)(l.Text,{html:t?.primaryButton||"Join Now",className:"text-sm font-bold leading-[1.4]"})}),(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"primary",size:"base",onClick:()=>r?.login?.(),children:(0,e.jsx)(l.Text,{html:t?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},ze=({menuOpen:t,onMenuOpenClose:n,onMenuOpenClick:o,actions:c})=>(0,e.jsxs)("div",{className:"flex h-full items-center justify-between gap-4",children:[(0,e.jsx)(le,{}),(0,e.jsxs)("div",{className:"desktop:gap-6 flex items-center gap-4",children:[(0,e.jsx)(oe,{actions:c}),t?(0,e.jsx)(P.Close,{className:"size-5",onClick:()=>n()}):(0,e.jsx)(P.Menu,{className:"size-5",onClick:()=>o()})]})]}),le=()=>{const{payloadData:t,isMobile:n}=(0,B.useNavContext)();return(0,e.jsx)("div",{className:"[&>svg]:w-full hover:text-brand-0 cursor-pointer",onClick:()=>{window.location.href="/"},dangerouslySetInnerHTML:{__html:n?t?.headerBar?.mobileLogo:t?.headerBar?.desktopLogo}})},oe=(0,a.forwardRef)(({actions:t,activeStatus:n=!1},o)=>{const{event:c,cartCount:r}=(0,B.useNavContext)(),[f,u]=(0,a.useState)(null),m=(0,a.useCallback)((d,w)=>{switch(u(w),d?.blockType){case x.HeaderNavigationActionBlockType.Search:c?.search?.();break;case x.HeaderNavigationActionBlockType.Cart:c?.cart?.();break;case x.HeaderNavigationActionBlockType.Profile:c?.profile?.();break;case x.HeaderNavigationActionBlockType.Livestream:c?.livestream?.();break;default:return()=>{}}},[c]);return(0,e.jsx)("div",{className:"desktop:gap-6 flex items-center gap-4",children:Array.isArray(t)&&t?.map((d,w)=>(0,e.jsxs)("div",{className:"relative",ref:d.blockType===x.HeaderNavigationActionBlockType.Profile?o:null,onClick:()=>m(d,w),children:[(0,e.jsx)(l.Text,{html:d.icon,className:(0,k.cn)("cursor-pointer size-5",{"text-brand-0":n&&f===w})}),d.blockType===x.HeaderNavigationActionBlockType.Cart&&r>0&&(0,e.jsx)("div",{className:"absolute min-h-5 z-[1] min-w-5 flex px-[2px] items-center justify-center right-[-12px] top-[calc(100%-16px)] bg-brand-0 rounded-full",children:(0,e.jsx)(l.Text,{html:r?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},d.id))})}),re=({title:t,onMenuOpenClose:n,onMenuBackClick:o})=>(0,e.jsxs)("div",{className:"flex h-full items-center gap-3",children:[(0,e.jsx)(P.LeftArrow,{className:"size-5",onClick:()=>o()}),(0,e.jsx)(l.Text,{html:t,className:"flex-1 text-center text-base font-bold leading-[1.4]"}),(0,e.jsx)(P.Close,{className:"size-5",onClick:()=>n()})]}),U=({label:t,href:n,onClick:o,active:c,icon:r,className:f})=>(0,e.jsx)("div",{className:(0,k.cn)("flex cursor-pointer items-center justify-between py-4",f),onClick:o,children:(0,e.jsxs)(l.Link,{href:n,asChild:!n,className:"flex w-full items-center justify-between no-underline",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(l.Text,{html:t,className:(0,k.cn)("text-sm font-bold leading-[1.4]",{underline:r})}),r&&(0,e.jsx)(l.Text,{html:r})]}),(0,e.jsx)(P.RightArrow,{className:(0,k.cn)("size-5 laptop:size-4",{"rotate-90":c})})]})});var Ee=(0,se.withLayout)(ye);
|
|
1
|
+
"use strict";"use client";var me=Object.create;var G=Object.defineProperty;var pe=Object.getOwnPropertyDescriptor;var be=Object.getOwnPropertyNames;var fe=Object.getPrototypeOf,ve=Object.prototype.hasOwnProperty;var ge=(t,n)=>{for(var o in n)G(t,o,{get:n[o],enumerable:!0})},Z=(t,n,o,c)=>{if(n&&typeof n=="object"||typeof n=="function")for(let r of be(n))!ve.call(t,r)&&r!==o&&G(t,r,{get:()=>n[r],enumerable:!(c=pe(n,r))||c.enumerable});return t};var K=(t,n,o)=>(o=t!=null?me(fe(t)):{},Z(n||!t||!t.__esModule?G(o,"default",{value:t,enumerable:!0}):o,t)),he=t=>Z(G({},"__esModule",{value:!0}),t);var He={};ge(He,{default:()=>Ee});module.exports=he(He);var e=require("react/jsx-runtime"),a=K(require("react")),l=require("../../components/index.js"),se=require("../../shared/Styles.js"),k=require("../../helpers/utils.js"),B=K(require("./NavProvider.js")),x=require("./types.js"),$e=require("react-responsive"),ie=require("es-toolkit"),ce=K(require("jump.js")),J=require("@gsap/react"),V=require("gsap"),T=require("./withCategory.js"),P=require("./icons/index.js"),de=K(require("../NavigationSearch/index.js"));const ye=(0,a.forwardRef)((t,n)=>{const{data:{headerNavigation:o}={},buildProps:c,event:r,profile:f,theme:u="light",isTop:m=!1,searchResult:d,onSearch:w,isSearching:i,keywords:C,onPrimaryNavClick:N,onSeriesProductClick:v,onSidebarNavClick:g,headerId:h,cartCount:p}=t,s=(0,a.useRef)(null),[b,S]=(0,a.useState)(!1),[D,z]=(0,a.useState)(!1),[L,j]=(0,a.useState)(!1),[_,M]=(0,a.useState)(!1),$=(0,a.useRef)(null),R=()=>{const F=document?.querySelector("body")?.offsetWidth||0;M(F<=1440)};(0,a.useEffect)(()=>(R(),window.addEventListener("resize",R),()=>{window.removeEventListener("resize",R)}),[]),(0,a.useImperativeHandle)(n,()=>$.current),(0,a.useEffect)(()=>{$.current&&m&&(0,ce.default)($.current,{duration:0,offset:$.current?.getBoundingClientRect()?.bottom||0})},[m]),(0,a.useEffect)(()=>{r&&(r.search=()=>S(!0))},[r]),(0,J.useGSAP)(()=>{s?.current&&b&&V.gsap.fromTo(s.current,{height:0},{height:"auto",duration:.3})},[b]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=b?"hidden":"auto"},[b]);const q=(0,a.useMemo)(()=>o?.headerBar?.actions?.find(F=>F?.blockType===x.HeaderNavigationActionBlockType.Search)?.searchBar?.[0]||{},[o]);return(0,e.jsx)(B.default,{buildProps:c,profile:f,isMobile:_,event:r,payloadData:o,onSidebarNavClick:g,onSeriesProductClick:v,cartCount:p,children:(0,e.jsx)("header",{id:h||"header","data-ui-component-id":"HeaderNavigation",className:"relative z-[100] bg-white",ref:$,children:(0,e.jsxs)("div",{className:(0,k.cn)("hover:text-black hover:bg-white",u==="light"?"text-black":"text-white",{}),onClick:()=>j(!0),children:[(0,e.jsx)(xe,{data:o,className:"hidden desktop:block !bg-white",theme:u,onNavItemClick:()=>j(!0),onPrimaryNavClick:N}),(0,e.jsx)(Ce,{data:o,className:"block desktop:hidden !bg-white",onPrimaryNavClick:N}),b&&(0,e.jsxs)("div",{className:"absolute z-[60] top-0 left-0 w-full bg-black/70 flex flex-col",style:{height:`calc(100dvh - ${$?.current?.getBoundingClientRect()?.top}px)`},children:[(0,e.jsx)("div",{ref:s,className:(0,k.cn)("overflow-y-auto",{}),children:(0,e.jsx)(de.default,{data:q,keywords:C,isSearching:i,searchResult:d,onSearch:F=>{w?.(F)},onClose:()=>{w?.(),S(!1)}})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>S(!1)})]})]})})})}),xe=(0,a.forwardRef)((t,n)=>{const{data:o,onNavItemClick:c,className:r,theme:f,onPrimaryNavClick:u}=t,{event:m,profile:d}=(0,B.useNavContext)(),[w,i]=(0,a.useState)(!1),C=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(o?.categories?.filter(y=>y?.pcShow)),[o]),[N,v]=(0,a.useState)(null),[g,h]=(0,a.useState)([]),p=(0,a.useRef)(null),[s,b]=(0,a.useState)(!1),S=(0,a.useRef)(null),D=(0,a.useRef)(null),z=(0,a.useRef)(C.map(y=>Array(y?.length||0).fill(null)));(0,a.useEffect)(()=>{C?.length&&h(C?.map((y,E)=>y?.map((H,A)=>({groupIndex:E,index:A,open:!1}))))},[C]);const L=(0,a.useMemo)(()=>{let y=null;for(const E of g){for(const H of E)if(H.open){y=H;break}if(y)break}return y},[g]);(0,a.useEffect)(()=>{document.documentElement.style.overflow=L?.open||s?"hidden":"auto"},[L?.open,s]);const j=(y,E,H)=>{if(b(!1),N?.components?.[0]?.blockType===x.HeaderNavigationBlockType.Links)N?.components?.[0]?.url&&window.open(N?.components?.[0]?.url);else{const A=C?.flat()||[],I=A?.findIndex(Y=>Y?.id===C[E][H]?.id);y.stopPropagation(),c?.(),u?.(A[I],I),v(C[E][H]),h(Y=>Y.map(ue=>ue.map(W=>W.groupIndex===E&&W.index===H?{...W,open:!W.open}:{...W,open:!1})))}},_=()=>{h(y=>y.map(E=>E.map(H=>({...H,open:!1}))))},M=(0,a.useMemo)(()=>{if(N)return N?.components?.[0]?.blockType},[N]),$=(0,T.WithSidebar)(Ne,N),R=(0,T.WithMulticol)(ke,N),q=(0,T.WithSupports)(we,{categoriesItem:N,currentNavItemRef:z.current?.[L?.groupIndex||0]?.[L?.index||0]}),F=(0,a.useMemo)(()=>{switch(M){case x.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)($,{});case x.HeaderNavigationBlockType.Supports:return(0,e.jsx)(q,{});case x.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(R,{});default:return null}},[M,N]),Q=(0,a.useMemo)(()=>o?.headerBar?.actions?.filter(y=>y?.pcShow),[o]),O=(0,a.useMemo)(()=>Q?.find(y=>y?.blockType===x.HeaderNavigationActionBlockType.Profile),[Q]),X=(0,a.useCallback)(()=>{b(y=>!y)},[]);return(0,a.useEffect)(()=>{if(p?.current){const y=p.current;return y.addEventListener("click",X),()=>{y.removeEventListener("click",X)}}},[X]),(0,J.useGSAP)(()=>{L?.open&&V.gsap.fromTo(D?.current,{height:0},{height:"auto"})},[L?.open]),(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[96px]",r),children:[(0,e.jsxs)("div",{ref:S,onClick:_,className:"flex h-full flex-col justify-end gap-4",children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",children:[(0,e.jsx)(le,{}),(0,e.jsx)(oe,{ref:p,actions:Q,activeStatus:s})]}),(0,e.jsx)("div",{className:"flex justify-between",children:C?.map((y,E)=>(0,e.jsx)("div",{className:"flex gap-3",children:y?.map((H,A)=>(0,e.jsx)("div",{ref:I=>{z.current[E][A]=I},className:"group cursor-pointer",children:(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsxs)("div",{className:"flex items-center gap-1 pb-4",onClick:I=>j(I,E,A),children:[(0,e.jsx)(l.Text,{html:H.text,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("opacity-0 size-4 group-hover:opacity-100 transition-opacity duration-500",{"rotate-180":L?.groupIndex===E&&L?.index===A,"opacity-100":w&&L?.groupIndex===E&&L?.index===A})})]}),(0,e.jsx)("div",{className:(0,k.cn)("absolute bottom-0 left-0 h-[2px] w-0 transition-all duration-500",{"w-[calc(100%-20px)]":L?.groupIndex===E&&L?.index===A},f==="dark"?"bg-white":"bg-[#1D1D1F]")})]})},H.id))},`groupCategory-${E}`))})]}),(0,e.jsxs)("div",{className:(0,k.cn)("border-t border-b-[#E4E5E6] text-black absolute left-0 top-full z-[999] flex w-full flex-col bg-black/70 overflow-hidden",{hidden:!(L?.open&&N)}),onMouseEnter:()=>i(!0),onMouseLeave:()=>i(!1),style:{height:`calc(100dvh - ${S?.current?.getBoundingClientRect()?.bottom}px)`},children:[(0,e.jsx)("div",{ref:D,className:(0,k.cn)("relative z-50",{"overflow-hidden":M!==x.HeaderNavigationBlockType.Supports}),children:F}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:_})]}),s&&(0,e.jsxs)("div",{className:"absolute left-0 z-[999] flex w-full bg-black/70 h-[100dvh] top-full",children:[(0,e.jsx)("div",{className:"absolute w-[272px] bg-white p-4",style:{right:`calc(100% - ${p?.current?.getBoundingClientRect()?.right}px)`,top:"-36px"},children:d?.email?(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:d?.nick_name||O?.welcome,className:"text-sm font-bold"}),(0,e.jsx)("div",{className:"h-[1px] mt-2 bg-[#D9D9D9]"}),(0,e.jsx)("div",{className:"mt-2",children:O?.profiles?.map(y=>(0,e.jsx)(U,{className:"py-2",label:y?.title,href:y?.url},y.id))})]}):(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(P.Polygon,{className:"absolute -top-2 text-white right-[46px] z-30"}),(0,e.jsx)(l.Text,{html:O?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:O?.benefits?.map(y=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:y.benefitIcon?.url,className:"size-4",alt:y.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:y.benefit,className:"text-sm font-bold leading-[1.4]"})]},y.id))}),(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-2",children:[(0,e.jsx)(l.Button,{variant:"secondary",size:"lg",onClick:()=>m?.join?.(),children:(0,e.jsx)(l.Text,{html:O?.primaryButton||"Join Now",className:"font-bold"})}),(0,e.jsx)(l.Button,{variant:"primary",size:"lg",onClick:()=>m?.login?.(),children:(0,e.jsx)(l.Text,{html:O?.secondaryButton||"Log In",className:"font-bold"})})]})]})}),(0,e.jsx)("div",{className:"flex-1 bg-transparent",onClick:()=>b(!1)})]})]})}),Ne=a.default.memo(({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{buildProps:o,onSidebarNavClick:c}=(0,B.useNavContext)(),[r,f]=(0,a.useState)([]),[u,m]=(0,a.useState)(-1),d=(0,a.useRef)(null),w=(0,a.useCallback)(()=>{const v=t?.subcategories;if(!v?.length)return;const g=v.findIndex(s=>!!s?.subSubCategories),h=v.findIndex(s=>!s?.subSubCategories),p=v.map((s,b)=>({index:b,open:g===b||h===b}));f(p)},[t]);(0,a.useEffect)(()=>{w()},[w]);const i=(0,a.useMemo)(()=>{const v=t?.subcategories?.[r?.find(h=>h.open)?.index||0],g=n?.find(h=>h?.label?.toLowerCase()===v?.label?.toLowerCase())||{};if(v?.collections){const h=o?.categories?.[v?.collections]||{};return{label:g?.label,isCollection:!0,banner:g?.banner,primary:g?.primary,series:[{products:h?.products}]}}else if(v?.subSubCategories){const h=v?.subSubCategories?.[u],p=n?.find(s=>s?.label?.toLowerCase()===h?.label?.toLowerCase())||{};if(h?.collections){const s=o?.categories?.[h?.collections]||{};return{label:p?.label,isCollection:!0,banner:p?.banner,primary:p?.primary,series:[{products:s?.products}]}}else return p}else return g},[t,r,u,n]),C=(0,a.useCallback)((v,g)=>{if(g?.subSubCategories?.length>0?m(0):m(-1),g?.subSubCategories?.length>0)f(h=>h.map(p=>p.index===v?{...p,open:!0}:{...p,open:!1}));else{const p=t?.subcategories?.findIndex(s=>!!s?.subSubCategories);f(s=>s.map(b=>({...b,open:b.index===v||b.index===p})))}},[t,w]),N=(v,g)=>{f(h=>h.map(p=>p.index===v?{...p,open:!0}:{...p,open:!1})),m(g)};return(0,e.jsxs)(l.Container,{childClassName:"lg-desktop:gap-12 flex bg-white gap-8",children:[(0,e.jsxs)("div",{className:"lg-desktop:basis-[356px] flex basis-[284px] flex-col gap-4 py-4",style:{userSelect:"none"},ref:d,children:[(0,e.jsx)("div",{className:"desktop:h-[416px] flex flex-col overflow-y-auto",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:t?.subcategories?.map((v,g)=>{const h=Array.isArray(v?.subSubCategories)&&v?.subSubCategories?.length>0;return(0,e.jsxs)("div",{children:[(0,e.jsxs)("div",{className:(0,k.cn)("flex cursor-pointer items-center justify-between",{"bg-[#F5F5F7]":!h&&r?.find(p=>p.index===g)?.open}),onClick:()=>{C(g,v),c?.(v,g)},children:[(0,e.jsx)(l.Text,{html:v.label,className:"p-4 text-sm font-bold leading-[1.4]"}),h&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-4",{"rotate-180":r?.find(p=>p.index===g)?.open})})]}),r?.find(p=>p.index===g)?.open&&(0,e.jsx)("div",{className:"flex flex-col",children:v.subSubCategories?.map((p,s)=>(0,e.jsx)(l.Text,{html:p.label,onClick:()=>{N(g,s),c?.(p,s)},className:(0,k.cn)("cursor-pointer hover:bg-[#F5F5F7] px-6 py-4 text-sm font-bold leading-[1.4] text-[#6D6D6F]",{"bg-[#F5F5F7]":u===s})},`subSubItem-${g}-${s}`))})]},`subcategoryItem-${g}`)})}),t&&(0,e.jsx)("div",{className:"flex",children:(0,e.jsxs)("div",{className:"flex flex-col gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"text-sm lg-desktop:text-base",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"justify-start !p-0 text-sm lg-desktop:text-base",children:t?.secondary?.label})]})})]}),(0,e.jsxs)("div",{className:"flex-1 py-4",children:[Reflect.ownKeys(i).length>0&&(0,e.jsxs)("div",{className:"mb-4 flex items-center justify-between",children:[(0,e.jsxs)("div",{className:"flex items-center gap-2",children:[(0,e.jsx)(l.Text,{html:i?.label,className:"text-xl lg-desktop:text-2xl font-bold leading-[1.4]"}),i?.primary&&!i?.primary?.hide&&(0,e.jsx)(l.Button,{as:"a",href:`${i?.primary?.url}?ref=${i?.label}_viewmore`,variant:"link",size:"lg",className:"justify-start !p-0 text-sm lg-desktop:text-base font-bold leading-[1.2] no-underline",children:i?.primary?.label})]}),(0,e.jsx)(l.Link,{href:i?.guide?.url,className:"text-sm lg-desktop:text-base leading-[1.2] text-[#6D6D6F]",children:i?.guide?.label})]}),(0,e.jsx)("div",{className:"flex flex-col gap-4 overflow-y-auto h-[426px]",style:{scrollbarWidth:"none",msOverflowStyle:"none"},children:i?.series?.map((v,g)=>(0,e.jsxs)("div",{children:[v.label&&(0,e.jsx)(l.Text,{html:v.label,className:"text-sm mb-2 font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsxs)("div",{className:"grid grid-cols-3 gap-4",children:[!!i?.banner&&(0,e.jsx)(l.Link,{asChild:!i?.banner?.href,href:i?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-600",children:[(0,e.jsx)(l.Picture,{source:i?.banner?.imageUrl,className:"h-[114px] laptop:h-[120px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute bottom-0 left-0 right-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:i?.banner?.title||"Buy in Guide",className:"font-bold text-white"}),(0,e.jsx)(l.Text,{html:i?.banner?.desc||"20.000mAh",className:"text-sm text-white font-bold"})]})]})}),v.products?.map((h,p)=>(0,e.jsx)(ee,{seriesLabel:i?.label,product:h,isCollection:i?.isCollection},`seriesProductItem-${p}`))]})]},`seriesItem-${g}`))})]})]})}),ke=({multicolMetadata:t})=>{const n=(0,a.useRef)(null);return(0,e.jsx)("div",{ref:n,children:(0,e.jsx)(l.Container,{childClassName:"bg-white",className:"h-full",children:(0,e.jsx)("div",{className:"flex gap-4 py-4",children:t?.map((o,c)=>(0,e.jsx)("div",{className:"w-1/4",children:(0,e.jsx)(te,{item:o})},`multicolItem-${o?.label}-${c}`))})})})},we=({supportsMetadata:t,currentNavItemRef:n})=>{const o=(0,a.useRef)(null),[c,r]=(0,a.useState)(null),[f,u]=(0,a.useState)(0);(0,a.useEffect)(()=>{if(o?.current){const d=o?.current?.getBoundingClientRect();u(d.height)}},[o]);const m=(0,ie.debounce)(()=>{if(n){const d=n.getBoundingClientRect();r(d)}},500);return(0,a.useEffect)(()=>(m(),window.addEventListener("resize",m),()=>{window.removeEventListener("resize",m)}),[m]),(0,a.useEffect)(()=>{if(n){const d=n.getBoundingClientRect();r(d)}},[n]),(0,e.jsx)("div",{className:"absolute top-0 h-full bg-white transition-all duration-500 overflow-hidden",style:{right:`calc(100% - ${c?.right}px)`,height:f},children:(0,e.jsx)("div",{ref:o,className:"p-4",children:t?.map(d=>(0,e.jsx)("div",{className:"py-2",children:(0,e.jsx)(l.Link,{href:d.url,className:"text-sm font-bold leading-[1.4] no-underline",children:d.label})},d.id))})})},ee=({product:t,isCollection:n,position:o,seriesLabel:c})=>{const{buildProps:r,onSeriesProductClick:f}=(0,B.useNavContext)();let u=n?t:r?.products?.find(i=>i.handle===t.handle);const m=u?.variants?.find(i=>i.sku===t.sku)||u?.variants?.[0],d=(0,a.useMemo)(()=>`/products/${u?.handle}?variant=${(0,k.atobID)(m?.id)}`,[u?.handle,m?.id]),w=(0,a.useMemo)(()=>u?.tags?.filter?.(i=>i?.startsWith?.("CLtag"))?.map?.(i=>i?.replace?.("CLtag:",""))?.slice?.(0,2),[u?.tags]);return m?.availableForSale?(0,e.jsxs)("div",{className:"flex shrink-0 items-center gap-4 bg-[#F5F5F7] px-4 py-3 [&_img]:hover:scale-110",children:[(0,e.jsx)("div",{className:"shrink-0",children:(0,e.jsx)(l.Picture,{source:`${m?.image?.url||t?.images?.[0]?.url}}`,width:90,height:90,className:"size-[96px]",imgClassName:"object-contain h-full"})}),(0,e.jsxs)("div",{className:"relative",children:[(0,e.jsx)("div",{className:"flex gap-1",children:Array.isArray(w)&&w?.map(i=>(0,e.jsx)(l.Text,{as:"p",html:i,className:"text-brand-0 whitespace-nowrap mb-1 inline-block h-[24px] rounded-full border-[1.6px] border-[#00BEFA] px-[6px] text-sm font-bold !leading-[22px]"}))}),(0,e.jsx)(l.Link,{href:d,onClick:i=>{i.preventDefault(),window.open(d),f?.(u,o||0,c)},className:"no-underline hover:text-current",children:(0,e.jsx)(l.Text,{className:"lg-desktop:h-[44px] lg-desktop:text-base line-clamp-2 h-[40px] text-sm font-bold leading-[1.4]",html:u?.title||t?.name})}),t?.desc&&(0,e.jsx)(l.Text,{as:"p",html:t?.desc,className:"lg-desktop:text-sm line-clamp-1 mt-1 text-xs font-bold leading-[1.4] text-[#6D6D6F]"})]})]}):null},te=({item:t,allPicture:n})=>(0,e.jsxs)(e.Fragment,{children:[t?.columns&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(l.Text,{html:t.label,as:"div",className:"my-2 text-sm font-bold leading-[1.4] text-[#6D6D6F]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col",children:t.columns?.map(o=>(0,e.jsxs)("div",{className:"py-2 flex items-center gap-1",children:[(0,e.jsx)(l.Link,{href:`${o.url}?ref=navMenu`,asChild:!o.url,className:"text-sm font-bold leading-[1.4] no-underline",children:o.label}),o?.badge&&(0,e.jsx)(l.Text,{as:"p",html:o?.badge||"badge",className:"text-sm font-bold !leading-[22px] text-brand-0 h-[24px] rounded-full border-[1.6px] border-[var(--brand-color-0)] px-[6px]"})]},o.label))})]}),t?.imageUrl&&(0,e.jsx)("div",{className:(0,k.cn)("laptop:h-[280px] desktop:h-[224px] lg-desktop:h-[280px] h-[240px] max-w-[358px] tablet:max-w-[346px] laptop:max-w-[440px] desktop:w-full relative overflow-hidden",{"tablet:max-w-none laptop:max-w-none":n}),children:(0,e.jsxs)(l.Link,{href:`${t.url}?ref=navMenu`,asChild:!t.url,children:[(0,e.jsx)(l.Picture,{source:t.imageUrl,width:404,height:280,className:"size-full",imgClassName:"object-cover h-full hover:scale-105 transition-all duration-300"}),(0,e.jsxs)("div",{className:"absolute bottom-4 left-4 z-10 flex flex-col justify-end no-underline",children:[(0,e.jsx)(l.Text,{html:t.title,className:(0,k.cn)("lg-desktop:text-2xl text-xl font-bold leading-[1.2] text-white",{"text-black":t?.theme==="dark"})}),t.subtitle&&(0,e.jsx)(l.Text,{html:t.subtitle,className:(0,k.cn)("text-sm font-bold leading-[1.4] text-white",{"text-black":t?.theme==="dark"})}),t?.primary?.label&&(0,e.jsx)(l.Button,{as:"a",href:t?.primary?.url,variant:"link",size:"lg",className:(0,k.cn)("text-sm font-bold mr-auto !p-0 leading-[1.4] text-white",{"text-black":t?.theme==="dark"}),children:t?.primary?.label||"more"})]})]})})]}),Ce=(0,a.forwardRef)(({data:t,className:n,onPrimaryNavClick:o},c)=>{const r=(0,a.useMemo)(()=>(0,T.WithGroupCategory)(t?.categories?.filter(M=>M?.mobileShow)),[t]),{currentMenu:f,setCurrentMenu:u,subSubCategory:m}=(0,B.useNavContext)(),[d,w]=(0,a.useState)(!1),[i,C]=(0,a.useState)(0),[N,v]=(0,a.useState)(null),g=(0,a.useRef)(null);(0,a.useEffect)(()=>{if(g?.current&&d){const M=g?.current?.getBoundingClientRect();C(window?.innerHeight-(M?.bottom||0))}},[d]),(0,J.useGSAP)(()=>{V.gsap.fromTo(g.current,{height:0},{height:i,duration:.3})},[i]),(0,a.useEffect)(()=>{document.documentElement.style.overflow=d?"hidden":"auto"},[d]);const h=(0,a.useMemo)(()=>N?.components?.[0]?.blockType,[N]),p=(0,T.WithSupports)(Le,{categoriesItem:N}),s=(0,T.WithSidebar)(De,N),b=(0,T.WithMulticol)(Me,N),S=(0,a.useMemo)(()=>{switch(h){case x.HeaderNavigationBlockType.Sidebar:return(0,e.jsx)(s,{});case x.HeaderNavigationBlockType.Supports:return(0,e.jsx)(p,{});case x.HeaderNavigationBlockType.Multicol:return(0,e.jsx)(b,{});default:return null}},[h,N,p]),D=(0,a.useCallback)(()=>{w(!1),C(0),u&&u(x.HeaderNavigationMenu.Primary)},[w,C,u]),z=(0,a.useMemo)(()=>t?.headerBar?.actions?.filter(M=>M?.mobileShow&&M?.blockType!==x.HeaderNavigationActionBlockType.Profile),[t]),L=(0,a.useMemo)(()=>t?.headerBar?.actions?.find(M=>M?.mobileShow&&M?.blockType===x.HeaderNavigationActionBlockType.Profile)||{},[t]),j=(0,a.useMemo)(()=>{switch(f){case x.HeaderNavigationMenu.Primary:return(0,e.jsx)(ze,{actions:z,menuOpen:d,onMenuOpenClose:()=>{w(!1),C(0)},onMenuOpenClick:()=>w(!0)});case x.HeaderNavigationMenu.Secondary:return(0,e.jsx)(re,{title:N?.text,onMenuOpenClose:D,onMenuBackClick:()=>u?.(x.HeaderNavigationMenu.Primary)});case x.HeaderNavigationMenu.Third:return(0,e.jsx)(re,{title:m?.label,onMenuOpenClose:D,onMenuBackClick:()=>u?.(x.HeaderNavigationMenu.Secondary)});default:return null}},[d,f,u,N,z,m,D]),_=(0,a.useCallback)((M,$)=>{const R=Array.isArray(r)?Array.isArray(r[M])?r[M][$]:{}:{};v(R),R?.components?.[0]?.blockType===x.HeaderNavigationBlockType.Links?R?.components?.[0]?.url&&window.open(R?.components?.[0]?.url):u?.(x.HeaderNavigationMenu.Secondary)},[r,u]);return(0,e.jsxs)(l.Container,{className:(0,k.cn)("relative h-[52px]",n),children:[j,d&&(0,e.jsx)("div",{ref:g,className:"absolute left-0 top-full text-black border-t border-[#E4E5E6] z-[999] w-full overflow-y-auto bg-white",style:{height:i},children:f===x.HeaderNavigationMenu.Primary?(0,e.jsx)(Se,{categories:r,onPrimaryMenuClick:_,onPrimaryNavClick:o,profileAction:L}):S})]})}),Se=({categories:t,onPrimaryMenuClick:n,profileAction:o,onPrimaryNavClick:c})=>{const{onSidebarNavClick:r}=(0,B.useNavContext)();return(0,e.jsxs)("div",{className:"flex h-full flex-col justify-between",children:[(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:t?.map((f,u)=>(0,e.jsxs)("div",{className:"",children:[f?.map((m,d)=>(0,e.jsx)(U,{label:m.text,onClick:()=>{const i=(t?.flat()||[])?.findIndex(C=>C?.id===t[u][d]?.id);n(u,d),c?.(m,i)},icon:m.components?.[0]?.icon},m.id)),(0,e.jsx)("div",{className:(0,k.cn)("my-2 h-px w-full bg-[#E5E5E7]",{hidden:u===t.length-1})})]},`groupCategory-${u}`))}),(0,e.jsx)(Pe,{profileAction:o})]})},De=({sidebarCategoriesMetadata:t,seriesMetadata:n})=>{const{currentMenu:o,setCurrentMenu:c,subSubCategory:r,setSubSubCategory:f,setCurrentSeriesMetadata:u,currentSeriesMetadata:m,buildProps:d,onSidebarNavClick:w}=(0,B.useNavContext)(),[i,C]=(0,a.useState)([]),[N,v]=(0,a.useState)([]);(0,a.useEffect)(()=>{t?.subcategories?.length&&C(t?.subcategories?.map((s,b)=>({index:b,open:!1})))},[t]),(0,a.useEffect)(()=>{r?.subSubCategories?.length&&v(r?.subSubCategories?.map((s,b)=>({index:b,open:b===0})))},[r]);const g=(0,a.useCallback)((s,b)=>{c&&c(x.HeaderNavigationMenu.Third),f?.(s);const S=n?.find(D=>b!==void 0?s?.subSubCategories?.[b]?.label?.toLowerCase()===D.label?.toLowerCase():s?.label?.toLowerCase()===D.label?.toLowerCase())||{};if(s?.collections){const D=d?.categories?.[s?.collections]||{};u?.({label:S?.label,isCollection:!0,banner:S?.banner,primary:S?.primary,series:[{products:D?.products}]})}else u?.(S)},[n,t,c,f,u]),h=(0,a.useMemo)(()=>n?.find(s=>!!s?.guide)?.guide,[n,t]);return(0,a.useMemo)(()=>{switch(o){case x.HeaderNavigationMenu.Secondary:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 flex h-full flex-col justify-between tablet:justify-start tablet:gap-16 p-4",children:[(0,e.jsx)("div",{children:t?.subcategories?.map((s,b)=>(0,e.jsx)("div",{children:(0,e.jsx)(U,{label:s?.label,active:i.find(S=>S.index===b)?.open,onClick:()=>{g(s),w?.(s,b)}})},`${s.label}-${b}`))}),(0,e.jsxs)("div",{className:"tablet:items-start flex flex-col items-center gap-4",children:[t?.primary&&(0,e.jsx)(l.Button,{as:"a",href:`${t?.primary?.url}?ref=${t?.primary?.label}_shopall`,variant:"primary",size:"lg",className:"tablet:w-auto w-full text-base",children:t?.primary?.label}),t?.secondary&&(0,e.jsx)(l.Button,{as:"a",href:t?.secondary?.url,variant:"link",size:"lg",className:"tablet:w-auto tablet:px-0 w-full py-0 text-base",children:t?.secondary?.label})]})]});case x.HeaderNavigationMenu.Third:return(0,e.jsxs)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:[r?.subSubCategories?r?.subSubCategories?.map((s,b)=>{const S=n?.find(z=>z.label.toLowerCase()===s?.label?.toLowerCase())||{};let D={};if(s?.collections){const z=d?.categories?.[s?.collections]||{};D={label:S?.label,isCollection:!0,banner:S?.banner,primary:S?.primary,series:[{products:z?.products}]}}else D=S;return(0,e.jsxs)("div",{children:[Reflect.ownKeys(s).length>0&&(0,e.jsx)(ae,{matchSeriesMetadata:D,onSubSubCategoryItemClick:()=>{w?.(s,b),v(z=>z.map((L,j)=>({...L,open:j===b?!L.open:L.open})))},expanded:!!N?.find(z=>z.index===b)?.open}),N?.find(z=>z.index===b)?.open&&(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(ne,{matchSeriesMetadata:D}),D?.primary&&(0,e.jsx)("div",{className:"text-center my-4",children:(0,e.jsx)(l.Button,{as:"a",href:D?.primary?.url,className:"text-base no-underline leading-[1.2]",variant:"secondary",size:"base",children:D?.primary?.label})})]})]},`${s.label}-${b}`)}):(0,e.jsxs)(e.Fragment,{children:[Reflect.ownKeys(m).length>0&&(0,e.jsx)(ae,{matchSeriesMetadata:m}),(0,e.jsx)(ne,{matchSeriesMetadata:m}),m?.primary&&(0,e.jsx)("div",{className:"text-center my-4 ",children:(0,e.jsx)(l.Button,{as:"a",href:`${m?.primary?.url}?ref=${m?.label}_viewmore`,variant:"secondary",size:"base",className:"text-base no-underline leading-[1.2]",children:m?.primary?.label})})]}),h&&(0,e.jsx)(l.Link,{href:h?.url,children:(0,e.jsx)("div",{className:"mt-4",children:(0,e.jsx)(l.Text,{html:h?.label,className:"text-sm font-bold leading-[1.2] text-[#6D6D6F]"})})})]});default:return null}},[o,t,c,n,i,N,f,r,u,m])},ae=({matchSeriesMetadata:t,onSubSubCategoryItemClick:n,expanded:o})=>(0,e.jsxs)("div",{className:"tablet:pt-0 py-4 flex items-center justify-between",onClick:n,children:[t?.label&&(0,e.jsx)(l.Text,{html:t?.label,className:"text-sm font-bold leading-[1.4]"}),n&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-5",{"rotate-180":o})})]}),ne=({matchSeriesMetadata:t})=>(0,e.jsx)("div",{className:"flex flex-col gap-2 laptop:gap-3",children:!!t?.series?.length&&t?.series?.map((n,o)=>(0,e.jsxs)("div",{children:[n.label&&(0,e.jsx)(l.Text,{html:n.label,className:"text-sm mb-2 font-bold leading-[1.4] text-[#3D3D3F]"}),(0,e.jsxs)("div",{className:"laptop:grid-cols-3 laptop:gap-4 tablet:grid tablet:grid-cols-2 tablet:gap-3 flex flex-col gap-2",children:[!!t?.banner&&(0,e.jsx)(l.Link,{asChild:!t?.banner?.href,href:t?.banner?.href,children:(0,e.jsxs)("div",{className:"relative [&_img]:hover:scale-110 [&_img]:hover:transition-all [&_img]:hover:duration-600",children:[(0,e.jsx)(l.Picture,{source:t?.banner?.imageUrl,className:"h-[114px] laptop:h-[120px]",imgClassName:"object-cover h-full"}),(0,e.jsxs)("div",{className:"absolute bottom-0 left-0 right-0 p-4",children:[(0,e.jsx)(l.Heading,{size:2,html:t?.banner?.title||"Buy in Guide",className:(0,k.cn)("font-bold text-white",{"text-black":t?.banner?.theme==="dark"})}),(0,e.jsx)(l.Text,{html:t?.banner?.desc||"20.000mAh",className:(0,k.cn)("text-sm text-white font-bold",{"text-black":t?.banner?.theme==="dark"})})]})]})}),n.products?.map((c,r)=>(0,e.jsx)(ee,{position:r,product:c,seriesLabel:t?.label,isCollection:t?.isCollection},`seriesProductItem-${o}-${r}`))]})]},`seriesItem-${o}`))}),Le=({supportsMetadata:t})=>(0,e.jsx)("div",{className:"tablet:px-8 laptop:px-16 p-4",children:t?.map(n=>(0,e.jsx)(U,{href:n.url,label:n.label,onClick:()=>{}},n.id))}),Me=({multicolMetadata:t})=>{const n=(0,a.useMemo)(()=>!t?.some(o=>!!o.columns),[t]);return(0,e.jsx)("div",{className:(0,k.cn)("tablet:py-4 tablet:px-8 laptop:px-16 flex flex-col gap-4 tablet:gap-6 p-4",{"tablet:grid tablet:grid-cols-2 tablet:gap-3 laptop:gap-4":n}),children:t?.map((o,c)=>(0,e.jsx)("div",{children:(0,e.jsx)(te,{item:o,allPicture:n})},`multicolItem-${o?.label}-${c}`))})},Pe=({profileAction:t})=>{const[n,o]=(0,a.useState)(!1),{profile:c,event:r}=(0,B.useNavContext)();return(0,e.jsxs)("div",{className:(0,k.cn)("tablet:px-8 laptop:px-16 bg-[#F5F5F7] px-4 py-6",{"p-4":n}),children:[(0,e.jsxs)("div",{className:"flex items-center justify-between",onClick:()=>o(!n),children:[(0,e.jsxs)("div",{className:"flex items-center gap-[14px]",children:[(0,e.jsx)("div",{className:"flex size-[40px] shrink-0 items-center justify-center rounded-full bg-white",children:(0,e.jsx)(P.User,{})}),(0,e.jsx)(l.Text,{html:c?.nick_name||t?.welcome,className:"text-base font-bold leading-[1.4]"})]}),!c?.email&&(0,e.jsx)(P.DownArrow,{className:(0,k.cn)("size-5 laptop:size-4",{"rotate-180":n})})]}),c?.email&&(0,e.jsx)("div",{className:"mt-4",children:t?.profiles?.map(f=>(0,e.jsx)(U,{label:f?.title,href:f?.url},f.id))}),n&&!c?.email&&(0,e.jsxs)("div",{className:"mt-4",children:[(0,e.jsx)(l.Text,{html:t?.benefits_title,className:"text-sm font-bold leading-[1.4]"}),(0,e.jsx)("div",{className:"mt-2 flex flex-col gap-1",children:t?.benefits?.map(f=>(0,e.jsxs)("div",{className:"flex items-center gap-[6px]",children:[(0,e.jsx)(l.Picture,{source:f.benefitIcon?.url,className:"size-4",alt:f.benefit,width:16,height:16}),(0,e.jsx)(l.Text,{html:f.benefit,className:"text-sm font-bold leading-[1.4]"})]},f.id))})]}),!c?.email&&(0,e.jsxs)("div",{className:"mt-4 flex items-center gap-3",children:[(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"secondary",size:"base",onClick:()=>r?.join?.(),children:(0,e.jsx)(l.Text,{html:t?.primaryButton||"Join Now",className:"text-sm font-bold leading-[1.4]"})}),(0,e.jsx)(l.Button,{className:"tablet:flex-none flex-1",variant:"primary",size:"base",onClick:()=>r?.login?.(),children:(0,e.jsx)(l.Text,{html:t?.secondaryButton||"Log In",className:"text-sm font-bold leading-[1.4]"})})]})]})},ze=({menuOpen:t,onMenuOpenClose:n,onMenuOpenClick:o,actions:c})=>(0,e.jsxs)("div",{className:"flex h-full items-center justify-between gap-4",children:[(0,e.jsx)(le,{}),(0,e.jsxs)("div",{className:"desktop:gap-6 flex items-center gap-4",children:[(0,e.jsx)(oe,{actions:c}),t?(0,e.jsx)(P.Close,{className:"size-5",onClick:()=>n()}):(0,e.jsx)(P.Menu,{className:"size-5",onClick:()=>o()})]})]}),le=()=>{const{payloadData:t,isMobile:n}=(0,B.useNavContext)();return(0,e.jsx)("div",{className:"[&>svg]:w-full hover:text-brand-0 cursor-pointer",onClick:()=>{window.location.href="/"},dangerouslySetInnerHTML:{__html:n?t?.headerBar?.mobileLogo:t?.headerBar?.desktopLogo}})},oe=(0,a.forwardRef)(({actions:t,activeStatus:n=!1},o)=>{const{event:c,cartCount:r}=(0,B.useNavContext)(),[f,u]=(0,a.useState)(null),m=(0,a.useCallback)((d,w)=>{switch(u(w),d?.blockType){case x.HeaderNavigationActionBlockType.Search:c?.search?.();break;case x.HeaderNavigationActionBlockType.Cart:c?.cart?.();break;case x.HeaderNavigationActionBlockType.Profile:c?.profile?.();break;case x.HeaderNavigationActionBlockType.Livestream:c?.livestream?.();break;default:return()=>{}}},[c]);return(0,e.jsx)("div",{className:"desktop:gap-6 flex items-center gap-4",children:Array.isArray(t)&&t?.map((d,w)=>(0,e.jsxs)("div",{className:"relative",ref:d.blockType===x.HeaderNavigationActionBlockType.Profile?o:null,onClick:()=>m(d,w),children:[(0,e.jsx)(l.Text,{html:d.icon,className:(0,k.cn)("cursor-pointer size-5",{"text-brand-0":n&&f===w})}),d.blockType===x.HeaderNavigationActionBlockType.Cart&&r>0&&(0,e.jsx)("div",{className:"absolute min-h-5 z-[1] min-w-5 flex px-[2px] items-center justify-center right-[-12px] top-[calc(100%-16px)] bg-brand-0 rounded-full",children:(0,e.jsx)(l.Text,{html:r?.toString(),className:"text-sm font-bold leading-[1.2] text-white"})})]},d.id))})}),re=({title:t,onMenuOpenClose:n,onMenuBackClick:o})=>(0,e.jsxs)("div",{className:"flex h-full items-center gap-3",children:[(0,e.jsx)(P.LeftArrow,{className:"size-5",onClick:()=>o()}),(0,e.jsx)(l.Text,{html:t,className:"flex-1 text-center text-base font-bold leading-[1.4]"}),(0,e.jsx)(P.Close,{className:"size-5",onClick:()=>n()})]}),U=({label:t,href:n,onClick:o,active:c,icon:r,className:f})=>(0,e.jsx)("div",{className:(0,k.cn)("flex cursor-pointer items-center justify-between py-4",f),onClick:o,children:(0,e.jsxs)(l.Link,{href:n,asChild:!n,className:"flex w-full items-center justify-between no-underline",children:[(0,e.jsxs)("div",{className:"flex items-center gap-4",children:[(0,e.jsx)(l.Text,{html:t,className:(0,k.cn)("text-sm font-bold leading-[1.4]",{underline:r})}),r&&(0,e.jsx)(l.Text,{html:r})]}),(0,e.jsx)(P.RightArrow,{className:(0,k.cn)("size-5 laptop:size-4",{"rotate-90":c})})]})});var Ee=(0,se.withLayout)(ye);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|