@anker-in/headless-ui 1.1.9-alpha.1764084619241 → 1.1.9-alpha.1764141671439
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/AccordionCards/index.d.ts +2 -2
- package/dist/cjs/biz-components/AplusDesc/index.d.ts +3 -2
- package/dist/cjs/biz-components/BrandEquity/BrandEquity.d.ts +3 -2
- package/dist/cjs/biz-components/BrandEquity/BrandEquity.js +1 -1
- package/dist/cjs/biz-components/BrandEquity/BrandEquity.js.map +3 -3
- package/dist/cjs/biz-components/BrandEquity/types.d.ts +0 -1
- package/dist/cjs/biz-components/BrandEquity/types.js +1 -1
- package/dist/cjs/biz-components/BrandEquity/types.js.map +1 -1
- package/dist/cjs/biz-components/Category/index.d.ts +2 -2
- package/dist/cjs/biz-components/CreativeModule/index.d.ts +3 -2
- package/dist/cjs/biz-components/DownLoad/index.d.ts +3 -2
- package/dist/cjs/biz-components/Evaluate/index.d.ts +2 -2
- package/dist/cjs/biz-components/Faq/Faq.d.ts +2 -2
- package/dist/cjs/biz-components/Faq/Faq.js.map +2 -2
- 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 +27 -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 +23 -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/Features/index.d.ts +3 -2
- package/dist/cjs/biz-components/FootCharger/index.d.ts +3 -2
- package/dist/cjs/biz-components/FooterNavigation/index.d.ts +3 -2
- package/dist/cjs/biz-components/GiftBox/index.d.ts +3 -2
- package/dist/cjs/biz-components/Graphic/index.d.ts +2 -2
- package/dist/cjs/biz-components/GraphicAttractionBlock/index.d.ts +2 -2
- package/dist/cjs/biz-components/GraphicMore/index.d.ts +3 -2
- package/dist/cjs/biz-components/GraphicOverlay/GraphicOverlay.d.ts +2 -2
- package/dist/cjs/biz-components/HeaderNavigation/index.d.ts +2 -2
- package/dist/cjs/biz-components/HeaderNavigation/index.js.map +2 -2
- package/dist/cjs/biz-components/HeroBanner/HeroBanner.d.ts +2 -2
- package/dist/cjs/biz-components/HeroBanner/HeroBanner.js +1 -1
- package/dist/cjs/biz-components/HeroBanner/HeroBanner.js.map +3 -3
- package/dist/cjs/biz-components/HeroBanner/types.d.ts +2 -0
- package/dist/cjs/biz-components/HeroBanner/types.js +1 -1
- package/dist/cjs/biz-components/HeroBanner/types.js.map +1 -1
- 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 +3 -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 +110 -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/InlineVideo/index.d.ts +16 -0
- package/dist/cjs/biz-components/InlineVideo/index.js +2 -0
- package/dist/cjs/biz-components/InlineVideo/index.js.map +7 -0
- package/dist/cjs/biz-components/Ksp/index.d.ts +44 -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/Listing/BizProductProvider.d.ts +1 -1
- package/dist/cjs/biz-components/Listing/components/PaidShipping/ShippingPolicyModal.js +1 -1
- package/dist/cjs/biz-components/Listing/components/PaidShipping/ShippingPolicyModal.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/PaidShipping/index.d.ts +19 -6
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.d.ts +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.d.ts +3 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.d.ts +3 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.d.ts +3 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.d.ts +3 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductDetail/ProductOptions/index.d.ts +3 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/components/CompareModal.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/components/CompareModal.js.map +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.d.ts +3 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductGallery/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/ProductCard/ProductSummary/index.d.ts +3 -2
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/types.d.ts +1 -0
- package/dist/cjs/biz-components/Listing/components/PurchaseBar/index.d.ts +3 -2
- package/dist/cjs/biz-components/Marquee/Marquee.d.ts +2 -2
- package/dist/cjs/biz-components/MarqueeReview/index.d.ts +42 -0
- package/dist/cjs/biz-components/MarqueeReview/index.js +2 -0
- package/dist/cjs/biz-components/MarqueeReview/index.js.map +7 -0
- package/dist/cjs/biz-components/MediaPlayerBase/index.backup.d.ts +7 -0
- package/dist/cjs/biz-components/MediaPlayerBase/index.backup.js +2 -0
- package/dist/cjs/biz-components/MediaPlayerBase/index.backup.js.map +7 -0
- package/dist/cjs/biz-components/MediaPlayerBase/index.d.ts +3 -2
- package/dist/cjs/biz-components/MediaPlayerBase/index.js +1 -1
- package/dist/cjs/biz-components/MediaPlayerBase/index.js.map +3 -3
- package/dist/cjs/biz-components/MediaPlayerMulti/index.d.ts +3 -2
- package/dist/cjs/biz-components/MediaPlayerSticky/index.d.ts +2 -2
- package/dist/cjs/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.d.ts +8 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js +11 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js.map +7 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/index.d.ts +2 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/index.js +2 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/index.js.map +7 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/types.d.ts +19 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/types.js +2 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/types.js.map +7 -0
- package/dist/cjs/biz-components/MemberEquity/index.d.ts +2 -2
- package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.d.ts +2 -2
- package/dist/cjs/biz-components/NavigationSearch/index.d.ts +1 -0
- package/dist/cjs/biz-components/ProductCompare/index.d.ts +54 -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 +23 -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/ProductNav/ProductNav.d.ts +7 -0
- package/dist/cjs/biz-components/ProductNav/ProductNav.js +2 -0
- package/dist/cjs/biz-components/ProductNav/ProductNav.js.map +7 -0
- package/dist/cjs/biz-components/ProductNav/index.d.ts +2 -0
- package/dist/cjs/biz-components/ProductNav/index.js +2 -0
- package/dist/cjs/biz-components/ProductNav/index.js.map +7 -0
- package/dist/cjs/biz-components/ProductNav/types.d.ts +35 -0
- package/dist/cjs/biz-components/ProductNav/types.js +2 -0
- package/dist/cjs/biz-components/ProductNav/types.js.map +7 -0
- package/dist/cjs/biz-components/SelectStore/index.d.ts +3 -2
- package/dist/cjs/biz-components/ShelfDisplay/index.d.ts +2 -2
- package/dist/cjs/biz-components/Slogan/index.d.ts +2 -2
- package/dist/cjs/biz-components/Spacer/index.d.ts +2 -2
- package/dist/cjs/biz-components/Spacer/index.js +1 -1
- package/dist/cjs/biz-components/Spacer/index.js.map +2 -2
- package/dist/cjs/biz-components/Specs/index.d.ts +2 -2
- 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 +29 -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/Tabs/Tabs.d.ts +2 -2
- package/dist/cjs/biz-components/Tabs/Tabs.js +1 -1
- package/dist/cjs/biz-components/Tabs/Tabs.js.map +1 -1
- package/dist/cjs/biz-components/Tabs/types.d.ts +11 -0
- package/dist/cjs/biz-components/Tabs/types.js +1 -1
- package/dist/cjs/biz-components/Tabs/types.js.map +1 -1
- package/dist/cjs/biz-components/TabsGroup/index.d.ts +2 -2
- 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 +43 -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/ThreeDCarousel/ThreeDCarousel.d.ts +11 -0
- package/dist/cjs/biz-components/ThreeDCarousel/ThreeDCarousel.js +2 -0
- package/dist/cjs/biz-components/ThreeDCarousel/ThreeDCarousel.js.map +7 -0
- package/dist/cjs/biz-components/ThreeDCarousel/index.d.ts +2 -0
- package/dist/cjs/biz-components/ThreeDCarousel/index.js +2 -0
- package/dist/cjs/biz-components/ThreeDCarousel/index.js.map +7 -0
- package/dist/cjs/biz-components/ThreeDCarousel/types.d.ts +26 -0
- package/dist/cjs/biz-components/ThreeDCarousel/types.js +2 -0
- package/dist/cjs/biz-components/ThreeDCarousel/types.js.map +7 -0
- package/dist/cjs/biz-components/Title/index.d.ts +2 -2
- package/dist/cjs/biz-components/Title/types.js +1 -1
- package/dist/cjs/biz-components/Title/types.js.map +1 -1
- 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 +19 -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/WhyChoose/WhyChoose.d.ts +2 -2
- package/dist/cjs/biz-components/index.d.ts +33 -0
- package/dist/cjs/biz-components/index.js +1 -1
- package/dist/cjs/biz-components/index.js.map +3 -3
- package/dist/cjs/components/alert.d.ts +2 -2
- package/dist/cjs/components/avatar.d.ts +8 -8
- package/dist/cjs/components/container.d.ts +7 -7
- package/dist/cjs/components/container.js +1 -1
- package/dist/cjs/components/container.js.map +2 -2
- package/dist/cjs/components/dialog.d.ts +1 -1
- package/dist/cjs/components/drop-down.d.ts +3 -3
- package/dist/cjs/components/heading.d.ts +1 -0
- package/dist/cjs/components/heading.js +1 -1
- package/dist/cjs/components/heading.js.map +3 -3
- package/dist/cjs/components/input-number.d.ts +15 -15
- package/dist/cjs/components/link.d.ts +6 -6
- package/dist/cjs/components/tabs.d.ts +2 -2
- package/dist/cjs/components/tabs.js +1 -1
- package/dist/cjs/components/tabs.js.map +2 -2
- package/dist/cjs/cpn-components/CpnNavigation/index.js +1 -1
- package/dist/cjs/cpn-components/CpnNavigation/index.js.map +3 -3
- package/dist/cjs/helpers/ScrollLoadVideo.js.map +2 -2
- package/dist/cjs/shared/ErrorBoundary.d.ts +18 -0
- package/dist/cjs/shared/ErrorBoundary.js +2 -0
- package/dist/cjs/shared/ErrorBoundary.js.map +7 -0
- package/dist/cjs/shared/Styles.d.ts +2 -2
- package/dist/cjs/shared/Styles.js +1 -1
- package/dist/cjs/shared/Styles.js.map +3 -3
- package/dist/cjs/stories/InlineVideo.stories.js +164 -0
- package/dist/cjs/stories/InlineVideo.stories.js.map +7 -0
- package/dist/cjs/stories/MarqueeReview.stories.js +19 -0
- package/dist/cjs/stories/MarqueeReview.stories.js.map +7 -0
- package/dist/cjs/stories/MediaSceneSwitcher.stories.js +2 -0
- package/dist/cjs/stories/MediaSceneSwitcher.stories.js.map +7 -0
- package/dist/cjs/stories/ProductNav.stories.js +2 -0
- package/dist/cjs/stories/ProductNav.stories.js.map +7 -0
- package/dist/cjs/stories/ThreeDCarousel.stories.js +118 -0
- package/dist/cjs/stories/ThreeDCarousel.stories.js.map +7 -0
- package/dist/cjs/stories/featureCards.stories.js +61 -0
- package/dist/cjs/stories/featureCards.stories.js.map +7 -0
- package/dist/cjs/stories/featureShowcase.stories.js +44 -0
- package/dist/cjs/stories/featureShowcase.stories.js.map +7 -0
- package/dist/cjs/stories/imageTextFeature.stories.js +50 -0
- package/dist/cjs/stories/imageTextFeature.stories.js.map +7 -0
- package/dist/cjs/stories/imageWithText.stories.js +84 -0
- package/dist/cjs/stories/imageWithText.stories.js.map +7 -0
- package/dist/cjs/stories/ksp.stories.js +128 -0
- package/dist/cjs/stories/ksp.stories.js.map +7 -0
- package/dist/cjs/stories/productCompare.stories.js +54 -0
- package/dist/cjs/stories/productCompare.stories.js.map +7 -0
- package/dist/cjs/stories/productHero.stories.js +50 -0
- package/dist/cjs/stories/productHero.stories.js.map +7 -0
- package/dist/cjs/stories/specsComparison.stories.js +105 -0
- package/dist/cjs/stories/specsComparison.stories.js.map +7 -0
- package/dist/cjs/stories/tabWithImage.stories.js +53 -0
- package/dist/cjs/stories/tabWithImage.stories.js.map +7 -0
- package/dist/cjs/stories/tabsWithMedia.stories.js +68 -0
- package/dist/cjs/stories/tabsWithMedia.stories.js.map +7 -0
- package/dist/cjs/stories/videoFeature.stories.js +56 -0
- package/dist/cjs/stories/videoFeature.stories.js.map +7 -0
- package/dist/cjs/types/props.d.ts +9 -2
- package/dist/cjs/types/props.js +1 -1
- package/dist/cjs/types/props.js.map +1 -1
- package/dist/esm/biz-components/AccordionCards/index.d.ts +2 -2
- package/dist/esm/biz-components/AplusDesc/index.d.ts +3 -2
- package/dist/esm/biz-components/BrandEquity/BrandEquity.d.ts +3 -2
- package/dist/esm/biz-components/BrandEquity/BrandEquity.js +1 -1
- package/dist/esm/biz-components/BrandEquity/BrandEquity.js.map +3 -3
- package/dist/esm/biz-components/BrandEquity/types.d.ts +0 -1
- package/dist/esm/biz-components/Category/index.d.ts +2 -2
- package/dist/esm/biz-components/CreativeModule/index.d.ts +3 -2
- package/dist/esm/biz-components/DownLoad/index.d.ts +3 -2
- package/dist/esm/biz-components/Evaluate/index.d.ts +2 -2
- package/dist/esm/biz-components/Faq/Faq.d.ts +2 -2
- package/dist/esm/biz-components/Faq/Faq.js +1 -1
- package/dist/esm/biz-components/Faq/Faq.js.map +2 -2
- 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 +27 -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 +23 -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/Features/index.d.ts +3 -2
- package/dist/esm/biz-components/FootCharger/index.d.ts +3 -2
- package/dist/esm/biz-components/FooterNavigation/index.d.ts +3 -2
- package/dist/esm/biz-components/GiftBox/index.d.ts +3 -2
- package/dist/esm/biz-components/Graphic/index.d.ts +2 -2
- package/dist/esm/biz-components/GraphicAttractionBlock/index.d.ts +2 -2
- package/dist/esm/biz-components/GraphicMore/index.d.ts +3 -2
- package/dist/esm/biz-components/GraphicOverlay/GraphicOverlay.d.ts +2 -2
- package/dist/esm/biz-components/HeaderNavigation/index.d.ts +2 -2
- package/dist/esm/biz-components/HeaderNavigation/index.js.map +2 -2
- package/dist/esm/biz-components/HeroBanner/HeroBanner.d.ts +2 -2
- package/dist/esm/biz-components/HeroBanner/HeroBanner.js +1 -1
- package/dist/esm/biz-components/HeroBanner/HeroBanner.js.map +3 -3
- package/dist/esm/biz-components/HeroBanner/types.d.ts +2 -0
- 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 +3 -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 +110 -0
- package/dist/esm/biz-components/ImageWithText/types.js +2 -0
- package/dist/esm/biz-components/ImageWithText/types.js.map +7 -0
- package/dist/esm/biz-components/InlineVideo/index.d.ts +16 -0
- package/dist/esm/biz-components/InlineVideo/index.js +2 -0
- package/dist/esm/biz-components/InlineVideo/index.js.map +7 -0
- package/dist/esm/biz-components/Ksp/index.d.ts +44 -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/Listing/BizProductProvider.d.ts +1 -1
- package/dist/esm/biz-components/Listing/components/PaidShipping/ShippingPolicyModal.js +1 -1
- package/dist/esm/biz-components/Listing/components/PaidShipping/ShippingPolicyModal.js.map +2 -2
- package/dist/esm/biz-components/Listing/components/PaidShipping/index.d.ts +19 -6
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/BenefitsTab.d.ts +2 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductBundle/index.d.ts +3 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductExchangePurchase/index.d.ts +3 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.d.ts +3 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductFreeGift/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductHighlight/index.d.ts +3 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductDetail/ProductOptions/index.d.ts +3 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/components/CompareModal.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/components/CompareModal.js.map +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.d.ts +3 -2
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.js +1 -1
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductGallery/index.js.map +3 -3
- package/dist/esm/biz-components/Listing/components/ProductCard/ProductSummary/index.d.ts +3 -2
- package/dist/esm/biz-components/Listing/components/PurchaseBar/ScrollSpyNav/types.d.ts +1 -0
- package/dist/esm/biz-components/Listing/components/PurchaseBar/index.d.ts +3 -2
- package/dist/esm/biz-components/Marquee/Marquee.d.ts +2 -2
- package/dist/esm/biz-components/MarqueeReview/index.d.ts +42 -0
- package/dist/esm/biz-components/MarqueeReview/index.js +2 -0
- package/dist/esm/biz-components/MarqueeReview/index.js.map +7 -0
- package/dist/esm/biz-components/MediaPlayerBase/index.backup.d.ts +7 -0
- package/dist/esm/biz-components/MediaPlayerBase/index.backup.js +2 -0
- package/dist/esm/biz-components/MediaPlayerBase/index.backup.js.map +7 -0
- package/dist/esm/biz-components/MediaPlayerBase/index.d.ts +3 -2
- package/dist/esm/biz-components/MediaPlayerBase/index.js +1 -1
- package/dist/esm/biz-components/MediaPlayerBase/index.js.map +3 -3
- package/dist/esm/biz-components/MediaPlayerMulti/index.d.ts +3 -2
- package/dist/esm/biz-components/MediaPlayerSticky/index.d.ts +2 -2
- package/dist/esm/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.d.ts +8 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js +11 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js.map +7 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/index.d.ts +2 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/index.js +2 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/index.js.map +7 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/types.d.ts +19 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/types.js +1 -0
- package/dist/esm/biz-components/MediaSceneSwitcher/types.js.map +7 -0
- package/dist/esm/biz-components/MemberEquity/index.d.ts +2 -2
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.d.ts +2 -2
- package/dist/esm/biz-components/NavigationSearch/index.d.ts +1 -0
- package/dist/esm/biz-components/ProductCompare/index.d.ts +54 -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 +23 -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/ProductNav/ProductNav.d.ts +7 -0
- package/dist/esm/biz-components/ProductNav/ProductNav.js +2 -0
- package/dist/esm/biz-components/ProductNav/ProductNav.js.map +7 -0
- package/dist/esm/biz-components/ProductNav/index.d.ts +2 -0
- package/dist/esm/biz-components/ProductNav/index.js +2 -0
- package/dist/esm/biz-components/ProductNav/index.js.map +7 -0
- package/dist/esm/biz-components/ProductNav/types.d.ts +35 -0
- package/dist/esm/biz-components/ProductNav/types.js +1 -0
- package/dist/esm/biz-components/ProductNav/types.js.map +7 -0
- package/dist/esm/biz-components/SelectStore/index.d.ts +3 -2
- package/dist/esm/biz-components/ShelfDisplay/index.d.ts +2 -2
- package/dist/esm/biz-components/Slogan/index.d.ts +2 -2
- package/dist/esm/biz-components/Spacer/index.d.ts +2 -2
- package/dist/esm/biz-components/Spacer/index.js +1 -1
- package/dist/esm/biz-components/Spacer/index.js.map +2 -2
- package/dist/esm/biz-components/Specs/index.d.ts +2 -2
- 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 +29 -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/Tabs/Tabs.d.ts +2 -2
- package/dist/esm/biz-components/Tabs/Tabs.js +1 -1
- package/dist/esm/biz-components/Tabs/Tabs.js.map +1 -1
- package/dist/esm/biz-components/Tabs/types.d.ts +11 -0
- package/dist/esm/biz-components/TabsGroup/index.d.ts +2 -2
- 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 +43 -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/ThreeDCarousel/ThreeDCarousel.d.ts +11 -0
- package/dist/esm/biz-components/ThreeDCarousel/ThreeDCarousel.js +2 -0
- package/dist/esm/biz-components/ThreeDCarousel/ThreeDCarousel.js.map +7 -0
- package/dist/esm/biz-components/ThreeDCarousel/index.d.ts +2 -0
- package/dist/esm/biz-components/ThreeDCarousel/index.js +2 -0
- package/dist/esm/biz-components/ThreeDCarousel/index.js.map +7 -0
- package/dist/esm/biz-components/ThreeDCarousel/types.d.ts +26 -0
- package/dist/esm/biz-components/ThreeDCarousel/types.js +1 -0
- package/dist/esm/biz-components/ThreeDCarousel/types.js.map +7 -0
- package/dist/esm/biz-components/Title/index.d.ts +2 -2
- 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 +19 -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/WhyChoose/WhyChoose.d.ts +2 -2
- package/dist/esm/biz-components/index.d.ts +33 -0
- package/dist/esm/biz-components/index.js +1 -1
- package/dist/esm/biz-components/index.js.map +2 -2
- package/dist/esm/components/alert.d.ts +2 -2
- package/dist/esm/components/avatar.d.ts +8 -8
- package/dist/esm/components/container.d.ts +7 -7
- package/dist/esm/components/container.js +1 -1
- package/dist/esm/components/container.js.map +2 -2
- package/dist/esm/components/dialog.d.ts +1 -1
- package/dist/esm/components/drop-down.d.ts +3 -3
- package/dist/esm/components/heading.d.ts +1 -0
- package/dist/esm/components/heading.js +1 -1
- package/dist/esm/components/heading.js.map +3 -3
- package/dist/esm/components/input-number.d.ts +15 -15
- package/dist/esm/components/link.d.ts +6 -6
- package/dist/esm/components/tabs.d.ts +2 -2
- package/dist/esm/components/tabs.js +1 -1
- package/dist/esm/components/tabs.js.map +2 -2
- package/dist/esm/cpn-components/CpnNavigation/index.js +1 -1
- package/dist/esm/cpn-components/CpnNavigation/index.js.map +2 -2
- package/dist/esm/helpers/ScrollLoadVideo.js.map +2 -2
- package/dist/esm/shared/ErrorBoundary.d.ts +18 -0
- package/dist/esm/shared/ErrorBoundary.js +2 -0
- package/dist/esm/shared/ErrorBoundary.js.map +7 -0
- package/dist/esm/shared/Styles.d.ts +2 -2
- package/dist/esm/shared/Styles.js +1 -1
- package/dist/esm/shared/Styles.js.map +3 -3
- package/dist/esm/stories/InlineVideo.stories.js +164 -0
- package/dist/esm/stories/InlineVideo.stories.js.map +7 -0
- package/dist/esm/stories/MarqueeReview.stories.js +19 -0
- package/dist/esm/stories/MarqueeReview.stories.js.map +7 -0
- package/dist/esm/stories/MediaSceneSwitcher.stories.js +2 -0
- package/dist/esm/stories/MediaSceneSwitcher.stories.js.map +7 -0
- package/dist/esm/stories/ProductNav.stories.js +2 -0
- package/dist/esm/stories/ProductNav.stories.js.map +7 -0
- package/dist/esm/stories/ThreeDCarousel.stories.js +118 -0
- package/dist/esm/stories/ThreeDCarousel.stories.js.map +7 -0
- package/dist/esm/stories/featureCards.stories.js +61 -0
- package/dist/esm/stories/featureCards.stories.js.map +7 -0
- package/dist/esm/stories/featureShowcase.stories.js +44 -0
- package/dist/esm/stories/featureShowcase.stories.js.map +7 -0
- package/dist/esm/stories/imageTextFeature.stories.js +50 -0
- package/dist/esm/stories/imageTextFeature.stories.js.map +7 -0
- package/dist/esm/stories/imageWithText.stories.js +84 -0
- package/dist/esm/stories/imageWithText.stories.js.map +7 -0
- package/dist/esm/stories/ksp.stories.js +128 -0
- package/dist/esm/stories/ksp.stories.js.map +7 -0
- package/dist/esm/stories/productCompare.stories.js +54 -0
- package/dist/esm/stories/productCompare.stories.js.map +7 -0
- package/dist/esm/stories/productHero.stories.js +50 -0
- package/dist/esm/stories/productHero.stories.js.map +7 -0
- package/dist/esm/stories/specsComparison.stories.js +105 -0
- package/dist/esm/stories/specsComparison.stories.js.map +7 -0
- package/dist/esm/stories/tabWithImage.stories.js +53 -0
- package/dist/esm/stories/tabWithImage.stories.js.map +7 -0
- package/dist/esm/stories/tabsWithMedia.stories.js +68 -0
- package/dist/esm/stories/tabsWithMedia.stories.js.map +7 -0
- package/dist/esm/stories/videoFeature.stories.js +56 -0
- package/dist/esm/stories/videoFeature.stories.js.map +7 -0
- package/dist/esm/types/props.d.ts +9 -2
- package/dist/tokens/base.css +3 -0
- package/package.json +18 -13
- package/style.css +11 -2
- package/tailwind.config.js +24 -0
- package/dist/cjs/stories/HeroBanner.stories.d.ts +0 -27
- package/dist/cjs/stories/MemberEquity.stories.d.ts +0 -9
- package/dist/cjs/stories/MultiLayoutGraphicBlock.stories.d.ts +0 -9
- package/dist/cjs/stories/accordionCards.stories.d.ts +0 -17
- package/dist/cjs/stories/alert.stories.d.ts +0 -27
- package/dist/cjs/stories/avatar.stories.d.ts +0 -39
- package/dist/cjs/stories/badge.stories.d.ts +0 -31
- package/dist/cjs/stories/bizTabs.stories.d.ts +0 -7
- package/dist/cjs/stories/board.stories.d.ts +0 -6
- package/dist/cjs/stories/brandEquity.stories.d.ts +0 -16
- package/dist/cjs/stories/button.stories.d.ts +0 -56
- package/dist/cjs/stories/card.stories.d.ts +0 -27
- package/dist/cjs/stories/carousel.stories.d.ts +0 -8
- package/dist/cjs/stories/category.stories.d.ts +0 -17
- package/dist/cjs/stories/checkbox.stories.d.ts +0 -46
- package/dist/cjs/stories/container.stories.d.ts +0 -28
- package/dist/cjs/stories/cpnBanner.stories.d.ts +0 -14
- package/dist/cjs/stories/cpnCountdown.stories.d.ts +0 -12
- package/dist/cjs/stories/cpnNavigation.stories.d.ts +0 -14
- package/dist/cjs/stories/cpnProductcard.stories.d.ts +0 -14
- package/dist/cjs/stories/cpnTitle.stories.d.ts +0 -14
- package/dist/cjs/stories/creativeModule.stories.d.ts +0 -19
- package/dist/cjs/stories/dialog.stories.d.ts +0 -20
- package/dist/cjs/stories/drawer.stories.d.ts +0 -20
- package/dist/cjs/stories/drop-down.stories.d.ts +0 -16
- package/dist/cjs/stories/evaluate.stories.d.ts +0 -16
- package/dist/cjs/stories/faq.stories.d.ts +0 -21
- package/dist/cjs/stories/graphic.stories.d.ts +0 -64
- package/dist/cjs/stories/graphicAttractionBlock.stories.d.ts +0 -6
- package/dist/cjs/stories/grid.stories.d.ts +0 -22
- package/dist/cjs/stories/heading.stories.d.ts +0 -84
- package/dist/cjs/stories/input-number.stories.d.ts +0 -39
- package/dist/cjs/stories/input.stories.d.ts +0 -35
- package/dist/cjs/stories/link.stories.d.ts +0 -69
- package/dist/cjs/stories/marquee.stories.d.ts +0 -30
- package/dist/cjs/stories/mediaplayerBase.stories.d.ts +0 -6
- package/dist/cjs/stories/mediaplayerMulti.stories.d.ts +0 -16
- package/dist/cjs/stories/picture.stories.d.ts +0 -22
- package/dist/cjs/stories/popover.stories.d.ts +0 -17
- package/dist/cjs/stories/radio.stories.d.ts +0 -39
- package/dist/cjs/stories/shelfDisplay.stories.d.ts +0 -16
- package/dist/cjs/stories/skeleton.stories.d.ts +0 -20
- package/dist/cjs/stories/slogan.stories.d.ts +0 -20
- package/dist/cjs/stories/specs.stories.d.ts +0 -13
- package/dist/cjs/stories/tabs.stories.d.ts +0 -373
- package/dist/cjs/stories/text.stories.d.ts +0 -86
- package/dist/cjs/stories/whychoose.stories.d.ts +0 -21
- package/dist/esm/stories/HeroBanner.stories.d.ts +0 -27
- package/dist/esm/stories/MemberEquity.stories.d.ts +0 -9
- package/dist/esm/stories/MultiLayoutGraphicBlock.stories.d.ts +0 -9
- package/dist/esm/stories/accordionCards.stories.d.ts +0 -17
- package/dist/esm/stories/alert.stories.d.ts +0 -27
- package/dist/esm/stories/avatar.stories.d.ts +0 -39
- package/dist/esm/stories/badge.stories.d.ts +0 -31
- package/dist/esm/stories/bizTabs.stories.d.ts +0 -7
- package/dist/esm/stories/board.stories.d.ts +0 -6
- package/dist/esm/stories/brandEquity.stories.d.ts +0 -16
- package/dist/esm/stories/button.stories.d.ts +0 -56
- package/dist/esm/stories/card.stories.d.ts +0 -27
- package/dist/esm/stories/carousel.stories.d.ts +0 -8
- package/dist/esm/stories/category.stories.d.ts +0 -17
- package/dist/esm/stories/checkbox.stories.d.ts +0 -46
- package/dist/esm/stories/container.stories.d.ts +0 -28
- package/dist/esm/stories/cpnBanner.stories.d.ts +0 -14
- package/dist/esm/stories/cpnCountdown.stories.d.ts +0 -12
- package/dist/esm/stories/cpnNavigation.stories.d.ts +0 -14
- package/dist/esm/stories/cpnProductcard.stories.d.ts +0 -14
- package/dist/esm/stories/cpnTitle.stories.d.ts +0 -14
- package/dist/esm/stories/creativeModule.stories.d.ts +0 -19
- package/dist/esm/stories/dialog.stories.d.ts +0 -20
- package/dist/esm/stories/drawer.stories.d.ts +0 -20
- package/dist/esm/stories/drop-down.stories.d.ts +0 -16
- package/dist/esm/stories/evaluate.stories.d.ts +0 -16
- package/dist/esm/stories/faq.stories.d.ts +0 -21
- package/dist/esm/stories/graphic.stories.d.ts +0 -64
- package/dist/esm/stories/graphicAttractionBlock.stories.d.ts +0 -6
- package/dist/esm/stories/grid.stories.d.ts +0 -22
- package/dist/esm/stories/heading.stories.d.ts +0 -84
- package/dist/esm/stories/input-number.stories.d.ts +0 -39
- package/dist/esm/stories/input.stories.d.ts +0 -35
- package/dist/esm/stories/link.stories.d.ts +0 -69
- package/dist/esm/stories/marquee.stories.d.ts +0 -30
- package/dist/esm/stories/mediaplayerBase.stories.d.ts +0 -6
- package/dist/esm/stories/mediaplayerMulti.stories.d.ts +0 -16
- package/dist/esm/stories/picture.stories.d.ts +0 -22
- package/dist/esm/stories/popover.stories.d.ts +0 -17
- package/dist/esm/stories/radio.stories.d.ts +0 -39
- package/dist/esm/stories/shelfDisplay.stories.d.ts +0 -16
- package/dist/esm/stories/skeleton.stories.d.ts +0 -20
- package/dist/esm/stories/slogan.stories.d.ts +0 -20
- package/dist/esm/stories/specs.stories.d.ts +0 -13
- package/dist/esm/stories/tabs.stories.d.ts +0 -373
- package/dist/esm/stories/text.stories.d.ts +0 -86
- package/dist/esm/stories/whychoose.stories.d.ts +0 -21
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
"use strict";var h=Object.create;var p=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var r=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var d=(e,t)=>{for(var a in t)p(e,a,{get:t[a],enumerable:!0})},m=(e,t,a,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of n(t))!g.call(e,o)&&o!==a&&p(e,o,{get:()=>t[o],enumerable:!(i=l(t,o))||i.enumerable});return e};var u=(e,t,a)=>(a=e!=null?h(r(e)):{},m(t||!e||!e.__esModule?p(a,"default",{value:e,enumerable:!0}):a,e)),f=e=>m(p({},"__esModule",{value:!0}),e);var C={};d(C,{Chinese:()=>q,CustomStyle:()=>U,Default:()=>y,NoTitle:()=>v,WithVideo:()=>k,default:()=>w});module.exports=f(C);var c=u(require("../biz-components/Ksp/index.js"));const b={title:"Biz-Components/Ksp",component:c.default,parameters:{layout:"fullscreen",docs:{description:{component:`
|
|
2
|
+
# Ksp \u5173\u952E\u5356\u70B9\u7EC4\u4EF6
|
|
3
|
+
|
|
4
|
+
\u5C55\u793A\u4EA7\u54C1\u7684\u5173\u952E\u5356\u70B9\uFF08Key Selling Points\uFF09\uFF0C\u652F\u6301\u56FE\u7247\u548C\u89C6\u9891\uFF0C\u5177\u6709\u590D\u6742\u7684\u54CD\u5E94\u5F0F\u5E03\u5C40\u3002
|
|
5
|
+
|
|
6
|
+
## \u6838\u5FC3\u529F\u80FD
|
|
7
|
+
|
|
8
|
+
- **\u56FE\u7247/\u89C6\u9891\u652F\u6301**\uFF1A\u6BCF\u4E2A\u5361\u7247\u53EF\u4EE5\u662F\u56FE\u7247\u6216\u89C6\u9891\uFF0C\u81EA\u52A8\u8BC6\u522B\u548C\u6E32\u67D3
|
|
9
|
+
- **7 \u5361\u7247\u5E03\u5C40**\uFF1A\u56FA\u5B9A 7 \u4E2A\u5361\u7247\u4F4D\u7F6E\uFF0C\u5177\u6709\u4E0D\u540C\u7684\u5C3A\u5BF8\u548C\u6392\u5217
|
|
10
|
+
- **\u54CD\u5E94\u5F0F\u8BBE\u8BA1**\uFF1A\u624B\u673A\u7AEF\u548C\u5E73\u677F/\u684C\u9762\u7AEF\u4F7F\u7528\u4E0D\u540C\u7684\u5E03\u5C40\u65B9\u6848
|
|
11
|
+
- **\u6587\u5B57\u8986\u76D6**\uFF1A\u6807\u9898\u548C\u63CF\u8FF0\u8986\u76D6\u5728\u5A92\u4F53\u5185\u5BB9\u4E0A
|
|
12
|
+
- **\u81EA\u52A8\u64AD\u653E**\uFF1A\u89C6\u9891\u81EA\u52A8\u64AD\u653E\u3001\u5FAA\u73AF\u3001\u9759\u97F3
|
|
13
|
+
|
|
14
|
+
## \u5E03\u5C40\u8BF4\u660E
|
|
15
|
+
|
|
16
|
+
### \u684C\u9762\u7AEF/\u5E73\u677F\u7AEF\u5E03\u5C40\uFF083 \u884C\uFF09\uFF1A
|
|
17
|
+
- **\u7B2C 1 \u884C**\uFF1A\u5927\u5361\u7247(59.53%) + \u5C0F\u5361\u7247(39.30%)
|
|
18
|
+
- **\u7B2C 2 \u884C**\uFF1A\u5C0F\u5361\u7247(29.19%) + \u4E2D\u5361\u7247(39.30%) + \u5C0F\u5361\u7247(29.19%)
|
|
19
|
+
- **\u7B2C 3 \u884C**\uFF1A\u5C0F\u5361\u7247(39.30%) + \u5927\u5361\u7247(59.53%)
|
|
20
|
+
|
|
21
|
+
### \u624B\u673A\u7AEF\u5E03\u5C40\uFF085 \u884C\uFF09\uFF1A
|
|
22
|
+
- **\u7B2C 1 \u884C**\uFF1A\u5168\u5BBD\u5361\u7247
|
|
23
|
+
- **\u7B2C 2 \u884C**\uFF1A\u4E24\u4E2A\u534A\u5BBD\u5361\u7247
|
|
24
|
+
- **\u7B2C 3 \u884C**\uFF1A\u5168\u5BBD\u5361\u7247
|
|
25
|
+
- **\u7B2C 4 \u884C**\uFF1A\u4E24\u4E2A\u534A\u5BBD\u5361\u7247
|
|
26
|
+
- **\u7B2C 5 \u884C**\uFF1A\u5168\u5BBD\u5361\u7247
|
|
27
|
+
|
|
28
|
+
## \u4F7F\u7528\u573A\u666F
|
|
29
|
+
|
|
30
|
+
\u9002\u7528\u4E8E\u4EA7\u54C1\u8BE6\u60C5\u9875\uFF0C\u5C55\u793A\u4EA7\u54C1\u7684\u6838\u5FC3\u4F18\u52BF\u548C\u7279\u8272\u529F\u80FD\u3002
|
|
31
|
+
|
|
32
|
+
## \u81EA\u5B9A\u4E49\u6837\u5F0F Class Names
|
|
33
|
+
|
|
34
|
+
\u7EC4\u4EF6\u63D0\u4F9B\u4EE5\u4E0B\u56FA\u5B9A\u7684 className\uFF0C\u65B9\u4FBF\u901A\u8FC7 CSS \u81EA\u5B9A\u4E49\u6837\u5F0F\uFF1A
|
|
35
|
+
|
|
36
|
+
### \u5E03\u5C40\u7C7B
|
|
37
|
+
- \`.ksp-container\` - \u4E3B\u5BB9\u5668
|
|
38
|
+
- \`.ksp-title\` - \u4E3B\u6807\u9898
|
|
39
|
+
- \`.ksp-desktop-layout\` - \u684C\u9762\u7AEF\u5E03\u5C40\u5BB9\u5668
|
|
40
|
+
- \`.ksp-mobile-layout\` - \u624B\u673A\u7AEF\u5E03\u5C40\u5BB9\u5668
|
|
41
|
+
- \`.ksp-row\` - \u884C\u5BB9\u5668
|
|
42
|
+
- \`.ksp-row-1\` - \u7B2C 1 \u884C\uFF08\u684C\u9762\u7AEF\uFF09
|
|
43
|
+
- \`.ksp-row-2\` - \u7B2C 2 \u884C\uFF08\u684C\u9762\u7AEF\uFF09
|
|
44
|
+
- \`.ksp-row-3\` - \u7B2C 3 \u884C\uFF08\u684C\u9762\u7AEF\uFF09
|
|
45
|
+
- \`.ksp-row-mobile-1\` - \u7B2C 1 \u884C\uFF08\u624B\u673A\u7AEF\uFF09
|
|
46
|
+
- \`.ksp-row-mobile-2\` - \u7B2C 2 \u884C\uFF08\u624B\u673A\u7AEF\uFF09
|
|
47
|
+
|
|
48
|
+
### \u5361\u7247\u7C7B
|
|
49
|
+
- \`.ksp-card\` - \u5361\u7247\u5BB9\u5668
|
|
50
|
+
- \`.ksp-card-image\` - \u5361\u7247\u56FE\u7247
|
|
51
|
+
- \`.ksp-card-video\` - \u5361\u7247\u89C6\u9891
|
|
52
|
+
- \`.ksp-card-video-desktop\` - \u684C\u9762\u7AEF\u89C6\u9891
|
|
53
|
+
- \`.ksp-card-video-mobile\` - \u79FB\u52A8\u7AEF\u89C6\u9891
|
|
54
|
+
- \`.ksp-card-content\` - \u5361\u7247\u6587\u5B57\u8986\u76D6\u5C42
|
|
55
|
+
- \`.ksp-card-title\` - \u5361\u7247\u6807\u9898
|
|
56
|
+
- \`.ksp-card-desc\` - \u5361\u7247\u63CF\u8FF0
|
|
57
|
+
|
|
58
|
+
### \u4F7F\u7528\u793A\u4F8B
|
|
59
|
+
|
|
60
|
+
\`\`\`css
|
|
61
|
+
/* \u81EA\u5B9A\u4E49\u4E3B\u6807\u9898\u6837\u5F0F */
|
|
62
|
+
.ksp-title {
|
|
63
|
+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
64
|
+
-webkit-background-clip: text;
|
|
65
|
+
-webkit-text-fill-color: transparent;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
/* \u5361\u7247 hover \u6548\u679C */
|
|
69
|
+
.ksp-card:hover {
|
|
70
|
+
transform: scale(1.02);
|
|
71
|
+
transition: transform 0.3s ease;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
/* \u81EA\u5B9A\u4E49\u5361\u7247\u6807\u9898\u989C\u8272 */
|
|
75
|
+
.ksp-card-title {
|
|
76
|
+
color: #fbbf24;
|
|
77
|
+
}
|
|
78
|
+
\`\`\`
|
|
79
|
+
|
|
80
|
+
\u{1F4A1} \u67E5\u770B **CustomStyle** story \u4E86\u89E3\u5B8C\u6574\u793A\u4F8B
|
|
81
|
+
`}}},tags:["autodocs"],argTypes:{data:{description:"KSP \u6570\u636E\uFF0C\u5305\u542B title \u548C items\uFF08\u9700\u8981 7 \u4E2A\u9879\uFF09",control:{type:"object"}},className:{description:"\u81EA\u5B9A\u4E49\u7C7B\u540D\uFF0C\u53EF\u914D\u5408\u4EE5\u4E0B\u56FA\u5B9A class name \u4F7F\u7528 CSS \u81EA\u5B9A\u4E49\u6837\u5F0F\uFF1A\n \n**\u5E03\u5C40\u76F8\u5173\uFF1A**\n- `.ksp-container` - \u4E3B\u5BB9\u5668\n- `.ksp-desktop-layout` - \u684C\u9762\u7AEF\u5E03\u5C40\u5BB9\u5668\n- `.ksp-mobile-layout` - \u624B\u673A\u7AEF\u5E03\u5C40\u5BB9\u5668\n- `.ksp-row` - \u884C\u5BB9\u5668\n- `.ksp-row-1/2/3` - \u684C\u9762\u7AEF\u5404\u884C\n- `.ksp-row-mobile-1/2` - \u624B\u673A\u7AEF\u5404\u884C\n\n**\u5361\u7247\u76F8\u5173\uFF1A**\n- `.ksp-card` - \u5361\u7247\u5BB9\u5668\n- `.ksp-card-image` - \u5361\u7247\u56FE\u7247\n- `.ksp-card-video` - \u5361\u7247\u89C6\u9891\n- `.ksp-card-video-desktop` - \u684C\u9762\u7AEF\u89C6\u9891\n- `.ksp-card-video-mobile` - \u79FB\u52A8\u7AEF\u89C6\u9891\n- `.ksp-card-content` - \u5361\u7247\u6587\u5B57\u8986\u76D6\u5C42\n- `.ksp-card-title` - \u5361\u7247\u6807\u9898\n- `.ksp-card-desc` - \u5361\u7247\u63CF\u8FF0\n\n**\u6587\u672C\u76F8\u5173\uFF1A**\n- `.ksp-title` - \u4E3B\u6807\u9898",control:{type:"text"}}}};var w=b;const s={title:"Why Choose Our Product",items:[{title:"Improved Cleaning Efficiency",desc:"HydroJet\u2122 Floor Washing System",image:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80",alt:"Improved Cleaning Efficiency",thumbnailURL:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80",alt:"Improved Cleaning Efficiency",thumbnailURL:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"100% Cleaning Coverage",desc:"Edge-Cleaning CornerRover\u2122 Arm",image:{url:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80",alt:"100% Cleaning Coverage",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80",alt:"100% Cleaning Coverage",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"All You Need, All-in-One",desc:"Complete Cleaning Solution",image:{url:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80",alt:"All You Need, All-in-One",thumbnailURL:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80",alt:"All You Need, All-in-One",thumbnailURL:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"Less Maintenance",desc:"DuoSpiral\u2122 Detangle Brushes",image:{url:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80",alt:"Less Maintenance",thumbnailURL:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80",alt:"Less Maintenance",thumbnailURL:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"Cleaning Power Upgrade",desc:"20,000 Pa Turbo Suction",image:{url:"https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80",alt:"Cleaning Power Upgrade",thumbnailURL:"https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80",alt:"Cleaning Power Upgrade",thumbnailURL:"https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"Intelligent Cleaning",desc:"Smart App Control & Scheduling",image:{url:"https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=1200&h=800&fit=crop&q=80",alt:"Intelligent Cleaning",thumbnailURL:"https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80",alt:"Intelligent Cleaning",thumbnailURL:"https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"AI.See\u2122 Obstacle Avoidance",desc:"Advanced Object Recognition",image:{url:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80",alt:"AI.See\u2122 Obstacle Avoidance",thumbnailURL:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80",alt:"AI.See\u2122 Obstacle Avoidance",thumbnailURL:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}}]},y={args:{data:s}},q={args:{data:{title:"\u4E3A\u4EC0\u4E48\u9009\u62E9\u6211\u4EEC\u7684\u4EA7\u54C1",items:[{title:"\u6E05\u6D01\u6548\u7387\u5927\u5E45\u63D0\u5347",desc:"HydroJet\u2122 \u5730\u677F\u6E05\u6D01\u7CFB\u7EDF",image:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80",alt:"Improved Cleaning Efficiency",thumbnailURL:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80",alt:"Improved Cleaning Efficiency",thumbnailURL:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"100% \u6E05\u6D01\u8986\u76D6",desc:"CornerRover\u2122 \u8FB9\u89D2\u6E05\u6D01\u81C2",image:{url:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80",alt:"100% Cleaning Coverage",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80",alt:"100% Cleaning Coverage",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"\u4E00\u673A\u591A\u7528\uFF0C\u5168\u80FD\u6E05\u6D01",desc:"\u5B8C\u6574\u7684\u6E05\u6D01\u89E3\u51B3\u65B9\u6848",image:{url:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80",alt:"All You Need, All-in-One",thumbnailURL:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80",alt:"All You Need, All-in-One",thumbnailURL:"https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"\u66F4\u5C11\u7EF4\u62A4",desc:"DuoSpiral\u2122 \u9632\u7F20\u7ED5\u5237\u5934",image:{url:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80",alt:"Less Maintenance",thumbnailURL:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80",alt:"Less Maintenance",thumbnailURL:"https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"\u6E05\u6D01\u80FD\u529B\u5347\u7EA7",desc:"20,000 Pa \u5F3A\u529B\u5438\u5C18",image:{url:"https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80",alt:"Cleaning Power Upgrade",thumbnailURL:"https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80",alt:"Cleaning Power Upgrade",thumbnailURL:"https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"\u667A\u80FD\u6E05\u6D01",desc:"APP \u8FDC\u7A0B\u63A7\u5236\u4E0E\u5B9A\u65F6",imageUrl:"https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=1200&h=800&fit=crop&q=80",mobImage:{url:"https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80",alt:"Intelligent Cleaning",thumbnailURL:"https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"AI \u667A\u80FD\u907F\u969C",desc:"\u5148\u8FDB\u7684\u7269\u4F53\u8BC6\u522B\u6280\u672F",image:{url:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80",alt:"AI \u667A\u80FD\u907F\u969C",thumbnailURL:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80",alt:"AI \u667A\u80FD\u907F\u969C",thumbnailURL:"https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}}]}}},k={args:{data:{title:"Experience the Difference",items:[{title:"Powerful Performance",desc:"See it in action",videoUrl:"https://cdn.shopify.com/videos/c/o/v/763f24558ba84e098b817740384a0f38.mp4",mobVideoUrl:"https://cdn.shopify.com/videos/c/o/v/bb1e9dcefc9e433a8bdf70215c39eedc.mp4",image:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80",alt:"Powerful Performance",thumbnailURL:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80",alt:"Powerful Performance",thumbnailURL:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},{title:"Smart Navigation",desc:"Advanced mapping technology",video:{url:"https://cdn.shopify.com/videos/c/o/v/61c978092bd24ca585f8a188b77458a6.mp4",alt:"Smart Navigation",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80",mimeType:"video/mp4"},mobVideo:{url:"https://cdn.shopify.com/videos/c/o/v/bb1e9dcefc9e433a8bdf70215c39eedc.mp4",alt:"Smart Navigation",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80",mimeType:"video/mp4"},image:{url:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80",alt:"Smart Navigation",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80",mimeType:"image/jpeg"},mobImage:{url:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80",alt:"Smart Navigation",thumbnailURL:"https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80",mimeType:"image/jpeg"}},...s.items.slice(2)]}}},v={args:{data:{items:s.items}}},U={args:{data:s,className:"py-20",style:`
|
|
82
|
+
/* \u4E3B\u6807\u9898 - \u6E10\u53D8\u8272\u6587\u5B57\u6548\u679C */
|
|
83
|
+
.ksp-title {
|
|
84
|
+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
85
|
+
-webkit-background-clip: text;
|
|
86
|
+
-webkit-text-fill-color: transparent;
|
|
87
|
+
background-clip: text;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
/* \u5361\u7247\u5BB9\u5668 - \u6DFB\u52A0\u8FC7\u6E21\u52A8\u753B */
|
|
91
|
+
.ksp-card {
|
|
92
|
+
transition: transform 0.3s ease;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
/* \u5361\u7247 hover \u6548\u679C - \u8F7B\u5FAE\u653E\u5927 */
|
|
96
|
+
.ksp-card:hover {
|
|
97
|
+
transform: scale(1.02);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
/* \u5361\u7247\u6807\u9898 - \u91D1\u8272\u6587\u5B57 */
|
|
101
|
+
.ksp-card-title {
|
|
102
|
+
color: #fbbf24;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
/* \u5361\u7247\u63CF\u8FF0 - \u6D45\u7070\u8272\u6587\u5B57 */
|
|
106
|
+
.ksp-card-desc {
|
|
107
|
+
color: #d1d5db;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
/* \u5361\u7247 hover \u6E10\u53D8\u8FB9\u6846\u6548\u679C */
|
|
111
|
+
.ksp-card::before {
|
|
112
|
+
content: '';
|
|
113
|
+
position: absolute;
|
|
114
|
+
inset: 0;
|
|
115
|
+
border: 2px solid transparent;
|
|
116
|
+
background: linear-gradient(135deg, #667eea, #764ba2) border-box;
|
|
117
|
+
-webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
|
|
118
|
+
-webkit-mask-composite: xor;
|
|
119
|
+
mask-composite: exclude;
|
|
120
|
+
opacity: 0;
|
|
121
|
+
transition: opacity 0.3s ease;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.ksp-card:hover::before {
|
|
125
|
+
opacity: 1;
|
|
126
|
+
}
|
|
127
|
+
`}};
|
|
128
|
+
//# sourceMappingURL=ksp.stories.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/stories/ksp.stories.tsx"],
|
|
4
|
+
"sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport Ksp from '../biz-components/Ksp/index.js'\nimport type { KspProps } from '../biz-components/Ksp/index.js'\n\nconst meta = {\n title: 'Biz-Components/Ksp',\n component: Ksp,\n parameters: {\n layout: 'fullscreen',\n docs: {\n description: {\n component: `\n# Ksp \u5173\u952E\u5356\u70B9\u7EC4\u4EF6\n\n\u5C55\u793A\u4EA7\u54C1\u7684\u5173\u952E\u5356\u70B9\uFF08Key Selling Points\uFF09\uFF0C\u652F\u6301\u56FE\u7247\u548C\u89C6\u9891\uFF0C\u5177\u6709\u590D\u6742\u7684\u54CD\u5E94\u5F0F\u5E03\u5C40\u3002\n\n## \u6838\u5FC3\u529F\u80FD\n\n- **\u56FE\u7247/\u89C6\u9891\u652F\u6301**\uFF1A\u6BCF\u4E2A\u5361\u7247\u53EF\u4EE5\u662F\u56FE\u7247\u6216\u89C6\u9891\uFF0C\u81EA\u52A8\u8BC6\u522B\u548C\u6E32\u67D3\n- **7 \u5361\u7247\u5E03\u5C40**\uFF1A\u56FA\u5B9A 7 \u4E2A\u5361\u7247\u4F4D\u7F6E\uFF0C\u5177\u6709\u4E0D\u540C\u7684\u5C3A\u5BF8\u548C\u6392\u5217\n- **\u54CD\u5E94\u5F0F\u8BBE\u8BA1**\uFF1A\u624B\u673A\u7AEF\u548C\u5E73\u677F/\u684C\u9762\u7AEF\u4F7F\u7528\u4E0D\u540C\u7684\u5E03\u5C40\u65B9\u6848\n- **\u6587\u5B57\u8986\u76D6**\uFF1A\u6807\u9898\u548C\u63CF\u8FF0\u8986\u76D6\u5728\u5A92\u4F53\u5185\u5BB9\u4E0A\n- **\u81EA\u52A8\u64AD\u653E**\uFF1A\u89C6\u9891\u81EA\u52A8\u64AD\u653E\u3001\u5FAA\u73AF\u3001\u9759\u97F3\n\n## \u5E03\u5C40\u8BF4\u660E\n\n### \u684C\u9762\u7AEF/\u5E73\u677F\u7AEF\u5E03\u5C40\uFF083 \u884C\uFF09\uFF1A\n- **\u7B2C 1 \u884C**\uFF1A\u5927\u5361\u7247(59.53%) + \u5C0F\u5361\u7247(39.30%)\n- **\u7B2C 2 \u884C**\uFF1A\u5C0F\u5361\u7247(29.19%) + \u4E2D\u5361\u7247(39.30%) + \u5C0F\u5361\u7247(29.19%)\n- **\u7B2C 3 \u884C**\uFF1A\u5C0F\u5361\u7247(39.30%) + \u5927\u5361\u7247(59.53%)\n\n### \u624B\u673A\u7AEF\u5E03\u5C40\uFF085 \u884C\uFF09\uFF1A\n- **\u7B2C 1 \u884C**\uFF1A\u5168\u5BBD\u5361\u7247\n- **\u7B2C 2 \u884C**\uFF1A\u4E24\u4E2A\u534A\u5BBD\u5361\u7247\n- **\u7B2C 3 \u884C**\uFF1A\u5168\u5BBD\u5361\u7247\n- **\u7B2C 4 \u884C**\uFF1A\u4E24\u4E2A\u534A\u5BBD\u5361\u7247\n- **\u7B2C 5 \u884C**\uFF1A\u5168\u5BBD\u5361\u7247\n\n## \u4F7F\u7528\u573A\u666F\n\n\u9002\u7528\u4E8E\u4EA7\u54C1\u8BE6\u60C5\u9875\uFF0C\u5C55\u793A\u4EA7\u54C1\u7684\u6838\u5FC3\u4F18\u52BF\u548C\u7279\u8272\u529F\u80FD\u3002\n\n## \u81EA\u5B9A\u4E49\u6837\u5F0F Class Names\n\n\u7EC4\u4EF6\u63D0\u4F9B\u4EE5\u4E0B\u56FA\u5B9A\u7684 className\uFF0C\u65B9\u4FBF\u901A\u8FC7 CSS \u81EA\u5B9A\u4E49\u6837\u5F0F\uFF1A\n\n### \u5E03\u5C40\u7C7B\n- \\`.ksp-container\\` - \u4E3B\u5BB9\u5668\n- \\`.ksp-title\\` - \u4E3B\u6807\u9898\n- \\`.ksp-desktop-layout\\` - \u684C\u9762\u7AEF\u5E03\u5C40\u5BB9\u5668\n- \\`.ksp-mobile-layout\\` - \u624B\u673A\u7AEF\u5E03\u5C40\u5BB9\u5668\n- \\`.ksp-row\\` - \u884C\u5BB9\u5668\n - \\`.ksp-row-1\\` - \u7B2C 1 \u884C\uFF08\u684C\u9762\u7AEF\uFF09\n - \\`.ksp-row-2\\` - \u7B2C 2 \u884C\uFF08\u684C\u9762\u7AEF\uFF09\n - \\`.ksp-row-3\\` - \u7B2C 3 \u884C\uFF08\u684C\u9762\u7AEF\uFF09\n - \\`.ksp-row-mobile-1\\` - \u7B2C 1 \u884C\uFF08\u624B\u673A\u7AEF\uFF09\n - \\`.ksp-row-mobile-2\\` - \u7B2C 2 \u884C\uFF08\u624B\u673A\u7AEF\uFF09\n\n### \u5361\u7247\u7C7B\n- \\`.ksp-card\\` - \u5361\u7247\u5BB9\u5668\n- \\`.ksp-card-image\\` - \u5361\u7247\u56FE\u7247\n- \\`.ksp-card-video\\` - \u5361\u7247\u89C6\u9891\n - \\`.ksp-card-video-desktop\\` - \u684C\u9762\u7AEF\u89C6\u9891\n - \\`.ksp-card-video-mobile\\` - \u79FB\u52A8\u7AEF\u89C6\u9891\n- \\`.ksp-card-content\\` - \u5361\u7247\u6587\u5B57\u8986\u76D6\u5C42\n- \\`.ksp-card-title\\` - \u5361\u7247\u6807\u9898\n- \\`.ksp-card-desc\\` - \u5361\u7247\u63CF\u8FF0\n\n### \u4F7F\u7528\u793A\u4F8B\n\n\\`\\`\\`css\n/* \u81EA\u5B9A\u4E49\u4E3B\u6807\u9898\u6837\u5F0F */\n.ksp-title {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n/* \u5361\u7247 hover \u6548\u679C */\n.ksp-card:hover {\n transform: scale(1.02);\n transition: transform 0.3s ease;\n}\n\n/* \u81EA\u5B9A\u4E49\u5361\u7247\u6807\u9898\u989C\u8272 */\n.ksp-card-title {\n color: #fbbf24;\n}\n\\`\\`\\`\n\n\uD83D\uDCA1 \u67E5\u770B **CustomStyle** story \u4E86\u89E3\u5B8C\u6574\u793A\u4F8B\n `,\n },\n },\n },\n tags: ['autodocs'],\n argTypes: {\n data: {\n description: 'KSP \u6570\u636E\uFF0C\u5305\u542B title \u548C items\uFF08\u9700\u8981 7 \u4E2A\u9879\uFF09',\n control: { type: 'object' },\n },\n className: {\n description: `\u81EA\u5B9A\u4E49\u7C7B\u540D\uFF0C\u53EF\u914D\u5408\u4EE5\u4E0B\u56FA\u5B9A class name \u4F7F\u7528 CSS \u81EA\u5B9A\u4E49\u6837\u5F0F\uFF1A\n \n**\u5E03\u5C40\u76F8\u5173\uFF1A**\n- \\`.ksp-container\\` - \u4E3B\u5BB9\u5668\n- \\`.ksp-desktop-layout\\` - \u684C\u9762\u7AEF\u5E03\u5C40\u5BB9\u5668\n- \\`.ksp-mobile-layout\\` - \u624B\u673A\u7AEF\u5E03\u5C40\u5BB9\u5668\n- \\`.ksp-row\\` - \u884C\u5BB9\u5668\n- \\`.ksp-row-1/2/3\\` - \u684C\u9762\u7AEF\u5404\u884C\n- \\`.ksp-row-mobile-1/2\\` - \u624B\u673A\u7AEF\u5404\u884C\n\n**\u5361\u7247\u76F8\u5173\uFF1A**\n- \\`.ksp-card\\` - \u5361\u7247\u5BB9\u5668\n- \\`.ksp-card-image\\` - \u5361\u7247\u56FE\u7247\n- \\`.ksp-card-video\\` - \u5361\u7247\u89C6\u9891\n- \\`.ksp-card-video-desktop\\` - \u684C\u9762\u7AEF\u89C6\u9891\n- \\`.ksp-card-video-mobile\\` - \u79FB\u52A8\u7AEF\u89C6\u9891\n- \\`.ksp-card-content\\` - \u5361\u7247\u6587\u5B57\u8986\u76D6\u5C42\n- \\`.ksp-card-title\\` - \u5361\u7247\u6807\u9898\n- \\`.ksp-card-desc\\` - \u5361\u7247\u63CF\u8FF0\n\n**\u6587\u672C\u76F8\u5173\uFF1A**\n- \\`.ksp-title\\` - \u4E3B\u6807\u9898`,\n control: { type: 'text' },\n },\n },\n} satisfies Meta<typeof Ksp>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\n// \u793A\u4F8B\u6570\u636E - 7 \u4E2A\u5361\u7247\nconst mockKspData: KspProps['data'] = {\n title: 'Why Choose Our Product',\n items: [\n {\n title: 'Improved Cleaning Efficiency',\n desc: 'HydroJet\u2122 Floor Washing System',\n image: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80',\n alt: 'Improved Cleaning Efficiency',\n thumbnailURL: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80',\n alt: 'Improved Cleaning Efficiency',\n thumbnailURL: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: '100% Cleaning Coverage',\n desc: 'Edge-Cleaning CornerRover\u2122 Arm',\n image: {\n url: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80',\n alt: '100% Cleaning Coverage',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80',\n alt: '100% Cleaning Coverage',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: 'All You Need, All-in-One',\n desc: 'Complete Cleaning Solution',\n image: {\n url: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80',\n alt: 'All You Need, All-in-One',\n thumbnailURL: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80',\n alt: 'All You Need, All-in-One',\n thumbnailURL: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: 'Less Maintenance',\n desc: 'DuoSpiral\u2122 Detangle Brushes',\n image: {\n url: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80',\n alt: 'Less Maintenance',\n thumbnailURL: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80',\n alt: 'Less Maintenance',\n thumbnailURL: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: 'Cleaning Power Upgrade',\n desc: '20,000 Pa Turbo Suction',\n image: {\n url: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80',\n alt: 'Cleaning Power Upgrade',\n thumbnailURL: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80',\n alt: 'Cleaning Power Upgrade',\n thumbnailURL: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: 'Intelligent Cleaning',\n desc: 'Smart App Control & Scheduling',\n image: {\n url: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=1200&h=800&fit=crop&q=80',\n alt: 'Intelligent Cleaning',\n thumbnailURL: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80',\n alt: 'Intelligent Cleaning',\n thumbnailURL: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: 'AI.See\u2122 Obstacle Avoidance',\n desc: 'Advanced Object Recognition',\n image: {\n url: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80',\n alt: 'AI.See\u2122 Obstacle Avoidance',\n thumbnailURL: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80',\n alt: 'AI.See\u2122 Obstacle Avoidance',\n thumbnailURL: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n ],\n}\n\n/**\n * \u9ED8\u8BA4\u72B6\u6001 - \u5C55\u793A\u5B8C\u6574\u7684 7 \u4E2A KSP \u5361\u7247\u5E03\u5C40\n *\n * \uD83D\uDCA1 \u63D0\u793A\uFF1A\u67E5\u770B \"CustomStyle\" story\uFF0C\u4E86\u89E3\u5982\u4F55\u4F7F\u7528\u56FA\u5B9A class name \u81EA\u5B9A\u4E49\u6837\u5F0F\n */\nexport const Default: Story = {\n args: {\n data: mockKspData,\n },\n}\n\n/**\n * \u4E2D\u6587\u5185\u5BB9 - \u5C55\u793A\u4E2D\u6587\u5356\u70B9\n */\nexport const Chinese: Story = {\n args: {\n data: {\n title: '\u4E3A\u4EC0\u4E48\u9009\u62E9\u6211\u4EEC\u7684\u4EA7\u54C1',\n items: [\n {\n title: '\u6E05\u6D01\u6548\u7387\u5927\u5E45\u63D0\u5347',\n desc: 'HydroJet\u2122 \u5730\u677F\u6E05\u6D01\u7CFB\u7EDF',\n image: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80',\n alt: 'Improved Cleaning Efficiency',\n thumbnailURL: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80',\n alt: 'Improved Cleaning Efficiency',\n thumbnailURL: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: '100% \u6E05\u6D01\u8986\u76D6',\n desc: 'CornerRover\u2122 \u8FB9\u89D2\u6E05\u6D01\u81C2',\n image: {\n url: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80',\n alt: '100% Cleaning Coverage',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80',\n alt: '100% Cleaning Coverage',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: '\u4E00\u673A\u591A\u7528\uFF0C\u5168\u80FD\u6E05\u6D01',\n desc: '\u5B8C\u6574\u7684\u6E05\u6D01\u89E3\u51B3\u65B9\u6848',\n image: {\n url: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80',\n alt: 'All You Need, All-in-One',\n thumbnailURL: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80',\n alt: 'All You Need, All-in-One',\n thumbnailURL: 'https://images.unsplash.com/photo-1556911220-bff31c812dba?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: '\u66F4\u5C11\u7EF4\u62A4',\n desc: 'DuoSpiral\u2122 \u9632\u7F20\u7ED5\u5237\u5934',\n image: {\n url: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80',\n alt: 'Less Maintenance',\n thumbnailURL: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80',\n alt: 'Less Maintenance',\n thumbnailURL: 'https://images.unsplash.com/photo-1550745165-9bc0b252726f?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: '\u6E05\u6D01\u80FD\u529B\u5347\u7EA7',\n desc: '20,000 Pa \u5F3A\u529B\u5438\u5C18',\n image: {\n url: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80',\n alt: 'Cleaning Power Upgrade',\n thumbnailURL: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80',\n alt: 'Cleaning Power Upgrade',\n thumbnailURL: 'https://images.unsplash.com/photo-1558002038-1055907df827?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: '\u667A\u80FD\u6E05\u6D01',\n desc: 'APP \u8FDC\u7A0B\u63A7\u5236\u4E0E\u5B9A\u65F6',\n imageUrl: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=1200&h=800&fit=crop&q=80',\n mobImage: {\n url: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80',\n alt: 'Intelligent Cleaning',\n thumbnailURL: 'https://images.unsplash.com/photo-1519389950473-47ba0277781c?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: 'AI \u667A\u80FD\u907F\u969C',\n desc: '\u5148\u8FDB\u7684\u7269\u4F53\u8BC6\u522B\u6280\u672F',\n image: {\n url: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80',\n alt: 'AI \u667A\u80FD\u907F\u969C',\n thumbnailURL: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80',\n alt: 'AI \u667A\u80FD\u907F\u969C',\n thumbnailURL: 'https://images.unsplash.com/photo-1535378917042-10a22c95931a?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n ],\n },\n },\n}\n\n/**\n * \u89C6\u9891\u5185\u5BB9 - \u5C55\u793A\u89C6\u9891\u5361\u7247\n */\nexport const WithVideo: Story = {\n args: {\n data: {\n title: 'Experience the Difference',\n items: [\n {\n title: 'Powerful Performance',\n desc: 'See it in action',\n videoUrl: 'https://cdn.shopify.com/videos/c/o/v/763f24558ba84e098b817740384a0f38.mp4',\n mobVideoUrl: 'https://cdn.shopify.com/videos/c/o/v/bb1e9dcefc9e433a8bdf70215c39eedc.mp4',\n image: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80',\n alt: 'Powerful Performance',\n thumbnailURL: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80',\n alt: 'Powerful Performance',\n thumbnailURL: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n {\n title: 'Smart Navigation',\n desc: 'Advanced mapping technology',\n video: {\n url: 'https://cdn.shopify.com/videos/c/o/v/61c978092bd24ca585f8a188b77458a6.mp4',\n alt: 'Smart Navigation',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80',\n mimeType: 'video/mp4',\n },\n mobVideo: {\n url: 'https://cdn.shopify.com/videos/c/o/v/bb1e9dcefc9e433a8bdf70215c39eedc.mp4',\n alt: 'Smart Navigation',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80',\n mimeType: 'video/mp4',\n },\n image: {\n url: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80',\n alt: 'Smart Navigation',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=1200&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n mobImage: {\n url: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80',\n alt: 'Smart Navigation',\n thumbnailURL: 'https://images.unsplash.com/photo-1563213126-a4273aed2016?w=600&h=800&fit=crop&q=80',\n mimeType: 'image/jpeg',\n },\n },\n ...mockKspData.items.slice(2),\n ],\n },\n },\n}\n\n/**\n * \u65E0\u6807\u9898 - \u53EA\u5C55\u793A\u5361\u7247\n */\nexport const NoTitle: Story = {\n args: {\n data: {\n items: mockKspData.items,\n },\n },\n}\n\n/**\n * \u81EA\u5B9A\u4E49\u6837\u5F0F\u793A\u4F8B\n *\n * \u5C55\u793A\u5982\u4F55\u901A\u8FC7\u56FA\u5B9A\u7684 class name \u81EA\u5B9A\u4E49\u7EC4\u4EF6\u6837\u5F0F\uFF1A\n * - `.ksp-title` - \u6E10\u53D8\u8272\u6807\u9898\n * - `.ksp-card` - hover \u7F29\u653E\u6548\u679C\n * - `.ksp-card-title` - \u91D1\u8272\u6807\u9898\n * - `.ksp-card-desc` - \u7070\u8272\u63CF\u8FF0\n * - `.ksp-card::before` - hover \u6E10\u53D8\u8FB9\u6846\n */\nexport const CustomStyle: Story = {\n args: {\n data: mockKspData,\n className: 'py-20',\n style: `\n /* \u4E3B\u6807\u9898 - \u6E10\u53D8\u8272\u6587\u5B57\u6548\u679C */\n .ksp-title {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n }\n \n /* \u5361\u7247\u5BB9\u5668 - \u6DFB\u52A0\u8FC7\u6E21\u52A8\u753B */\n .ksp-card {\n transition: transform 0.3s ease;\n }\n \n /* \u5361\u7247 hover \u6548\u679C - \u8F7B\u5FAE\u653E\u5927 */\n .ksp-card:hover {\n transform: scale(1.02);\n }\n \n /* \u5361\u7247\u6807\u9898 - \u91D1\u8272\u6587\u5B57 */\n .ksp-card-title {\n color: #fbbf24;\n }\n \n /* \u5361\u7247\u63CF\u8FF0 - \u6D45\u7070\u8272\u6587\u5B57 */\n .ksp-card-desc {\n color: #d1d5db;\n }\n \n /* \u5361\u7247 hover \u6E10\u53D8\u8FB9\u6846\u6548\u679C */\n .ksp-card::before {\n content: '';\n position: absolute;\n inset: 0;\n border: 2px solid transparent;\n background: linear-gradient(135deg, #667eea, #764ba2) border-box;\n -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\n -webkit-mask-composite: xor;\n mask-composite: exclude;\n opacity: 0;\n transition: opacity 0.3s ease;\n }\n \n .ksp-card:hover::before {\n opacity: 1;\n }\n `,\n },\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["ksp_stories_exports", "__export", "Chinese", "CustomStyle", "Default", "NoTitle", "WithVideo", "ksp_stories_default", "__toCommonJS", "import_Ksp", "meta", "Ksp", "mockKspData"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
"use strict";var l=Object.create;var i=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var n=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,f=Object.prototype.hasOwnProperty;var g=(t,e)=>{for(var a in e)i(t,a,{get:e[a],enumerable:!0})},s=(t,e,a,m)=>{if(e&&typeof e=="object"||typeof e=="function")for(let p of n(e))!f.call(t,p)&&p!==a&&i(t,p,{get:()=>e[p],enumerable:!(m=d(e,p))||m.enumerable});return t};var y=(t,e,a)=>(a=t!=null?l(h(t)):{},s(e||!t||!t.__esModule?i(a,"default",{value:t,enumerable:!0}):a,t)),u=t=>s(i({},"__esModule",{value:!0}),t);var E={};g(E,{CenterAlign:()=>C,CompleteExample:()=>j,DarkTheme:()=>I,Default:()=>T,PrimaryTitle:()=>A,SecondaryTitle:()=>w,SellingPointTitle:()=>v,ThreeImages:()=>k,TwoImagesEqualRatio:()=>P,WithSubtitleImage:()=>S,default:()=>x});module.exports=u(E);var r=require("react/jsx-runtime"),c=y(require("../biz-components/ProductCompare/index.js"));const b={title:"Biz-Components/ProductCompare",component:c.default,parameters:{layout:"fullscreen",docs:{description:{component:`
|
|
2
|
+
# ProductCompare \u4EA7\u54C1\u5BF9\u6BD4\u7EC4\u4EF6
|
|
3
|
+
|
|
4
|
+
\u7528\u4E8E\u5C55\u793A\u4EA7\u54C1\u5BF9\u6BD4\u6548\u679C\uFF0C\u901A\u8FC7\u89C6\u89C9\u5316\u7684\u65B9\u5F0F\u7A81\u51FA\u4EA7\u54C1\u4F18\u52BF\uFF0C\u652F\u63012-3\u4E2A\u4EA7\u54C1\u7684\u7075\u6D3B\u5BF9\u6BD4\u3002
|
|
5
|
+
|
|
6
|
+
## \u{1F3AF} \u6838\u5FC3\u529F\u80FD
|
|
7
|
+
|
|
8
|
+
- **\u7075\u6D3B\u5E03\u5C40**\uFF1A\u652F\u63012-3\u4E2A\u4EA7\u54C1\u5BF9\u6BD4\uFF0C\u53EF\u914D\u7F6E\u5BBD\u5EA6\u6BD4\u4F8B
|
|
9
|
+
- **3\u79CD\u6807\u9898\u7C7B\u578B**\uFF1A
|
|
10
|
+
- \u5356\u70B9\u6807\u9898\uFF08selling-point\uFF09\uFF1A\u5E26\u56FE\u6807\uFF0C\u6807\u9898\u989C\u8272 #00BEFA
|
|
11
|
+
- \u4E00\u7EA7\u6807\u9898\uFF08primary\uFF09\uFF1A\u5E38\u89C4\u6807\u9898\uFF0Csize=4
|
|
12
|
+
- \u4E8C\u7EA7\u6807\u9898\uFF08secondary\uFF09\uFF1A\u8F83\u5C0F\u6807\u9898\uFF0Csize=3
|
|
13
|
+
- **\u6587\u672C\u5BF9\u9F50**\uFF1A\u652F\u6301\u5DE6\u5BF9\u9F50\u548C\u5C45\u4E2D\u5BF9\u9F50
|
|
14
|
+
- **\u526F\u6807\u9898\u56FE\u7247**\uFF1A\u652F\u6301\u5728\u526F\u6807\u9898\u4E0B\u65B9\u663E\u793A\u56FE\u7247
|
|
15
|
+
- **\u5A92\u4F53\u7C7B\u578B\u81EA\u9002\u5E94**\uFF1A\u81EA\u52A8\u8BC6\u522B\u89C6\u9891/\u56FE\u7247\u683C\u5F0F\uFF0C\u6839\u636E mimeType \u6E32\u67D3\u5BF9\u5E94\u5143\u7D20
|
|
16
|
+
- **\u54CD\u5E94\u5F0F\u8BBE\u8BA1**\uFF1A\u79FB\u52A8\u7AEF\u5782\u76F4\u5E03\u5C40\uFF0C\u5E73\u677F/\u684C\u9762\u7AEF\u6C34\u5E73\u5E03\u5C40
|
|
17
|
+
- **\u667A\u80FD\u61D2\u52A0\u8F7D**\uFF1A\u4F7F\u7528 Intersection Observer API\uFF0C\u8DDD\u79BB\u89C6\u53E3 1500px \u63D0\u524D\u52A0\u8F7D
|
|
18
|
+
- **\u89C6\u9891\u81EA\u52A8\u64AD\u653E**\uFF1A\u652F\u6301\u81EA\u52A8\u64AD\u653E\u3001\u5FAA\u73AF\u3001\u9759\u97F3\uFF0C\u517C\u5BB9 iOS Safari\u3001\u5FAE\u4FE1/QQ \u6D4F\u89C8\u5668
|
|
19
|
+
- **\u4E3B\u9898\u652F\u6301**\uFF1A\u5185\u7F6E light/dark \u4E3B\u9898
|
|
20
|
+
- **\u5706\u89D2\u914D\u7F6E**\uFF1A\u652F\u6301\u5706\u89D2\uFF08laptop \u4EE5\u4E0B 12px\uFF0Claptop \u4EE5\u4E0A 16px\uFF09\u548C\u76F4\u89D2
|
|
21
|
+
|
|
22
|
+
## \u{1F4D0} \u5E03\u5C40\u6BD4\u4F8B
|
|
23
|
+
|
|
24
|
+
### 2\u5F20\u56FE\u7247
|
|
25
|
+
- 2:3 \u6BD4\u4F8B\uFF08\u9ED8\u8BA4\uFF09
|
|
26
|
+
- 1:1 \u6BD4\u4F8B\uFF08\u53EF\u914D\u7F6E\uFF09
|
|
27
|
+
|
|
28
|
+
### 3\u5F20\u56FE\u7247
|
|
29
|
+
- 1:1:1 \u7B49\u5BBD
|
|
30
|
+
|
|
31
|
+
## \u{1F3F7}\uFE0F \u6807\u7B7E\u6837\u5F0F
|
|
32
|
+
|
|
33
|
+
- **\u6700\u540E\u4E00\u4E2A\u4EA7\u54C1**\uFF1Abg-brand-0 \u80CC\u666F\uFF0C\u767D\u8272\u6587\u5B57
|
|
34
|
+
- **\u5176\u4ED6\u4EA7\u54C1**\uFF1Argba(0,0,0,0.2) \u80CC\u666F\uFF0C\u767D\u8272\u6587\u5B57
|
|
35
|
+
|
|
36
|
+
## \u{1F4F1} \u517C\u5BB9\u6027
|
|
37
|
+
|
|
38
|
+
- **iOS Safari**\uFF1Awebkit-playsinline \u5185\u8054\u64AD\u653E
|
|
39
|
+
- **Android Chrome**\uFF1A\u6807\u51C6 HTML5 \u89C6\u9891\u64AD\u653E
|
|
40
|
+
- **\u5FAE\u4FE1/QQ \u6D4F\u89C8\u5668**\uFF1AX5 \u5185\u6838\u540C\u5C42\u64AD\u653E\uFF0C\u4E0D\u52AB\u6301\u5168\u5C4F
|
|
41
|
+
- **\u684C\u9762\u6D4F\u89C8\u5668**\uFF1A\u7981\u7528\u753B\u4E2D\u753B\u548C\u8FDC\u7A0B\u64AD\u653E
|
|
42
|
+
|
|
43
|
+
## \u{1F3A8} \u81EA\u5B9A\u4E49\u6837\u5F0F
|
|
44
|
+
|
|
45
|
+
\u7EC4\u4EF6\u63D0\u4F9B\u8BED\u4E49\u5316 className\uFF1A
|
|
46
|
+
- \`.product-compare\` - \u7EC4\u4EF6\u5BB9\u5668
|
|
47
|
+
- \`.product-compare-title / .product-compare-subtitle\` - \u6807\u9898/\u526F\u6807\u9898
|
|
48
|
+
- \`.product-compare-title-icon\` - \u6807\u9898\u56FE\u6807\uFF08\u5356\u70B9\u7C7B\u578B\uFF09
|
|
49
|
+
- \`.product-compare-subtitle-image\` - \u526F\u6807\u9898\u56FE\u7247
|
|
50
|
+
- \`.product-compare-item\` - \u5355\u4E2A\u4EA7\u54C1\u5BB9\u5668
|
|
51
|
+
- \`.product-compare-label\` - \u4EA7\u54C1\u6807\u7B7E
|
|
52
|
+
- \`.product-compare-media\` - \u5A92\u4F53\u5143\u7D20
|
|
53
|
+
`}}},decorators:[t=>(0,r.jsx)("div",{style:{padding:"2em"},children:(0,r.jsx)(t,{})})],tags:["autodocs"]};var x=b;const o={title:"\u6027\u80FD\u5BF9\u6BD4",titleType:"primary",subtitle:"\u771F\u5B9E\u573A\u666F\u4E0B\u7684\u8868\u73B0\u5DEE\u5F02",textAlign:"left",twoImageRatio:"2:3",theme:"light",products:[{text:"\u5176\u4ED6\u54C1\u724C",media:{url:"https://cdn.shopify.com/videos/c/o/v/61c978092bd24ca585f8a188b77458a6.mp4",alt:"\u7ADE\u54C1\u6F14\u793A",thumbnailURL:"https://via.placeholder.com/400x300",mimeType:"video/mp4",height:560,width:544},mobMedia:{url:"https://cdn.shopify.com/videos/c/o/v/3f97af0b92b2434eb2d11cb0307e3d08.mp4",alt:"\u7ADE\u54C1\u6F14\u793A\uFF08\u79FB\u52A8\u7248\uFF09",thumbnailURL:"https://via.placeholder.com/300x400",mimeType:"video/mp4"},poster:"https://via.placeholder.com/800x600/666666/ffffff?text=Competitor",mobPoster:"https://via.placeholder.com/600x800/666666/ffffff?text=Competitor"},{text:"Eufy E25",media:{url:"https://cdn.shopify.com/videos/c/o/v/763f24558ba84e098b817740384a0f38.mp4",alt:"Eufy E25 \u4EA7\u54C1\u6F14\u793A",thumbnailURL:"https://via.placeholder.com/400x300",mimeType:"video/mp4",height:560,width:360},mobMedia:{url:"https://cdn.shopify.com/videos/c/o/v/bb1e9dcefc9e433a8bdf70215c39eedc.mp4",alt:"Eufy E25 \u4EA7\u54C1\u6F14\u793A\uFF08\u79FB\u52A8\u7248\uFF09",thumbnailURL:"https://via.placeholder.com/300x400",mimeType:"video/mp4"},poster:"https://via.placeholder.com/800x600/008CD6/ffffff?text=Anker+E25",mobPoster:"https://via.placeholder.com/600x800/008CD6/ffffff?text=Anker+E25"}]},T={args:{data:o}},v={args:{data:{...o,titleType:"selling-point",title:"\u8D85\u5F3A\u7EED\u822A\u80FD\u529B",titleIcon:{url:"https://cdn-icons-png.flaticon.com/512/1828/1828884.png",alt:"\u7535\u6C60\u56FE\u6807",mimeType:"image/png"}}},parameters:{docs:{description:{story:"\u5356\u70B9\u6807\u9898\u7C7B\u578B\uFF1A\u5E26\u56FE\u6807\uFF0C\u6807\u9898\u989C\u8272\u4E3A #00BEFA"}}}},A={args:{data:{...o,titleType:"primary",title:"\u6027\u80FD\u5BF9\u6BD4"}},parameters:{docs:{description:{story:"\u4E00\u7EA7\u6807\u9898\u7C7B\u578B\uFF1Asize=4"}}}},w={args:{data:{...o,titleType:"secondary",title:"\u6E05\u6D01\u6548\u679C\u5BF9\u6BD4"}},parameters:{docs:{description:{story:"\u4E8C\u7EA7\u6807\u9898\u7C7B\u578B\uFF1Asize=3\uFF0C\u5B57\u4F53\u8F83\u5C0F"}}}},C={args:{data:{...o,textAlign:"center"}},parameters:{docs:{description:{story:"\u6807\u9898\u548C\u526F\u6807\u9898\u5C45\u4E2D\u5BF9\u9F50"}}}},S={args:{data:{...o,subtitleImage:{url:"https://via.placeholder.com/800x200/008CD6/ffffff?text=Feature+Comparison+Chart",alt:"\u529F\u80FD\u5BF9\u6BD4\u56FE",mimeType:"image/png",width:800,height:200}}},parameters:{docs:{description:{story:"\u5728\u526F\u6807\u9898\u4E0B\u65B9\u663E\u793A\u56FE\u7247"}}}},P={args:{data:{...o,twoImageRatio:"1:1"}},parameters:{docs:{description:{story:"2\u5F20\u56FE\u7247\u7B49\u5BBD 1:1 \u6BD4\u4F8B"}}}},k={args:{data:{...o,title:"\u591A\u4EA7\u54C1\u5BF9\u6BD4",subtitle:"\u4E09\u6B3E\u4EA7\u54C1\u5168\u9762\u5BF9\u6BD4",products:[{text:"\u54C1\u724C A",media:{url:"https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=800&h=600&fit=crop",alt:"\u54C1\u724C A",mimeType:"image/jpeg"},mobMedia:{url:"https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=600&h=800&fit=crop",alt:"\u54C1\u724C A",mimeType:"image/jpeg"}},{text:"\u54C1\u724C B",media:{url:"https://images.unsplash.com/photo-1572635196237-14b3f281503f?w=800&h=600&fit=crop",alt:"\u54C1\u724C B",mimeType:"image/jpeg"},mobMedia:{url:"https://images.unsplash.com/photo-1572635196237-14b3f281503f?w=600&h=800&fit=crop",alt:"\u54C1\u724C B",mimeType:"image/jpeg"}},{text:"Anker \u65D7\u8230",media:{url:"https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=800&h=600&fit=crop",alt:"Anker \u65D7\u8230",mimeType:"image/jpeg"},mobMedia:{url:"https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=600&h=800&fit=crop",alt:"Anker \u65D7\u8230",mimeType:"image/jpeg"}}]}},parameters:{docs:{description:{story:"3\u5F20\u56FE\u7247 1:1:1 \u7B49\u5BBD\u5E03\u5C40"}}}},I={args:{data:{...o,theme:"dark"}},parameters:{docs:{description:{story:"Dark \u4E3B\u9898\u6837\u5F0F"}}}},j={args:{data:{titleType:"selling-point",title:"\u667A\u80FD\u6E05\u6D01\u7CFB\u7EDF",titleIcon:{url:"https://cdn-icons-png.flaticon.com/512/2917/2917995.png",alt:"\u667A\u80FD\u56FE\u6807",mimeType:"image/png"},subtitle:"\u5168\u65B9\u4F4D\u5BF9\u6BD4\uFF0C\u770B\u89C1\u771F\u5B9E\u5DEE\u5F02",subtitleImage:{url:"https://via.placeholder.com/600x150/008CD6/ffffff?text=AI+Powered+Cleaning",alt:"AI \u6E05\u6D01\u7CFB\u7EDF",mimeType:"image/png",width:600,height:150},textAlign:"center",theme:"light",twoImageRatio:"2:3",products:[{text:"\u666E\u901A\u4EA7\u54C1",media:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=800&h=600&fit=crop",alt:"\u666E\u901A\u4EA7\u54C1",mimeType:"image/jpeg"},mobMedia:{url:"https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop",alt:"\u666E\u901A\u4EA7\u54C1",mimeType:"image/jpeg"}},{text:"Anker \u667A\u80FD\u7248",media:{url:"https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=800&h=600&fit=crop",alt:"Anker \u667A\u80FD\u7248",mimeType:"image/jpeg"},mobMedia:{url:"https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=600&h=800&fit=crop",alt:"Anker \u667A\u80FD\u7248",mimeType:"image/jpeg"}}]}},parameters:{docs:{description:{story:"\u7EFC\u5408\u793A\u4F8B\uFF1A\u5C55\u793A\u591A\u79CD\u529F\u80FD\u7EC4\u5408\u4F7F\u7528"}}}};
|
|
54
|
+
//# sourceMappingURL=productCompare.stories.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/stories/productCompare.stories.tsx"],
|
|
4
|
+
"sourcesContent": ["import type { Meta, StoryObj } from '@storybook/react'\nimport ProductCompare from '../biz-components/ProductCompare/index.js'\nimport type { ProductCompareProps } from '../biz-components/ProductCompare/index.js'\n\nconst meta = {\n title: 'Biz-Components/ProductCompare',\n component: ProductCompare,\n parameters: {\n layout: 'fullscreen',\n docs: {\n description: {\n component: `\n# ProductCompare \u4EA7\u54C1\u5BF9\u6BD4\u7EC4\u4EF6\n\n\u7528\u4E8E\u5C55\u793A\u4EA7\u54C1\u5BF9\u6BD4\u6548\u679C\uFF0C\u901A\u8FC7\u89C6\u89C9\u5316\u7684\u65B9\u5F0F\u7A81\u51FA\u4EA7\u54C1\u4F18\u52BF\uFF0C\u652F\u63012-3\u4E2A\u4EA7\u54C1\u7684\u7075\u6D3B\u5BF9\u6BD4\u3002\n\n## \uD83C\uDFAF \u6838\u5FC3\u529F\u80FD\n\n- **\u7075\u6D3B\u5E03\u5C40**\uFF1A\u652F\u63012-3\u4E2A\u4EA7\u54C1\u5BF9\u6BD4\uFF0C\u53EF\u914D\u7F6E\u5BBD\u5EA6\u6BD4\u4F8B\n- **3\u79CD\u6807\u9898\u7C7B\u578B**\uFF1A\n - \u5356\u70B9\u6807\u9898\uFF08selling-point\uFF09\uFF1A\u5E26\u56FE\u6807\uFF0C\u6807\u9898\u989C\u8272 #00BEFA\n - \u4E00\u7EA7\u6807\u9898\uFF08primary\uFF09\uFF1A\u5E38\u89C4\u6807\u9898\uFF0Csize=4\n - \u4E8C\u7EA7\u6807\u9898\uFF08secondary\uFF09\uFF1A\u8F83\u5C0F\u6807\u9898\uFF0Csize=3\n- **\u6587\u672C\u5BF9\u9F50**\uFF1A\u652F\u6301\u5DE6\u5BF9\u9F50\u548C\u5C45\u4E2D\u5BF9\u9F50\n- **\u526F\u6807\u9898\u56FE\u7247**\uFF1A\u652F\u6301\u5728\u526F\u6807\u9898\u4E0B\u65B9\u663E\u793A\u56FE\u7247\n- **\u5A92\u4F53\u7C7B\u578B\u81EA\u9002\u5E94**\uFF1A\u81EA\u52A8\u8BC6\u522B\u89C6\u9891/\u56FE\u7247\u683C\u5F0F\uFF0C\u6839\u636E mimeType \u6E32\u67D3\u5BF9\u5E94\u5143\u7D20\n- **\u54CD\u5E94\u5F0F\u8BBE\u8BA1**\uFF1A\u79FB\u52A8\u7AEF\u5782\u76F4\u5E03\u5C40\uFF0C\u5E73\u677F/\u684C\u9762\u7AEF\u6C34\u5E73\u5E03\u5C40\n- **\u667A\u80FD\u61D2\u52A0\u8F7D**\uFF1A\u4F7F\u7528 Intersection Observer API\uFF0C\u8DDD\u79BB\u89C6\u53E3 1500px \u63D0\u524D\u52A0\u8F7D\n- **\u89C6\u9891\u81EA\u52A8\u64AD\u653E**\uFF1A\u652F\u6301\u81EA\u52A8\u64AD\u653E\u3001\u5FAA\u73AF\u3001\u9759\u97F3\uFF0C\u517C\u5BB9 iOS Safari\u3001\u5FAE\u4FE1/QQ \u6D4F\u89C8\u5668\n- **\u4E3B\u9898\u652F\u6301**\uFF1A\u5185\u7F6E light/dark \u4E3B\u9898\n- **\u5706\u89D2\u914D\u7F6E**\uFF1A\u652F\u6301\u5706\u89D2\uFF08laptop \u4EE5\u4E0B 12px\uFF0Claptop \u4EE5\u4E0A 16px\uFF09\u548C\u76F4\u89D2\n\n## \uD83D\uDCD0 \u5E03\u5C40\u6BD4\u4F8B\n\n### 2\u5F20\u56FE\u7247\n- 2:3 \u6BD4\u4F8B\uFF08\u9ED8\u8BA4\uFF09\n- 1:1 \u6BD4\u4F8B\uFF08\u53EF\u914D\u7F6E\uFF09\n\n### 3\u5F20\u56FE\u7247\n- 1:1:1 \u7B49\u5BBD\n\n## \uD83C\uDFF7\uFE0F \u6807\u7B7E\u6837\u5F0F\n\n- **\u6700\u540E\u4E00\u4E2A\u4EA7\u54C1**\uFF1Abg-brand-0 \u80CC\u666F\uFF0C\u767D\u8272\u6587\u5B57\n- **\u5176\u4ED6\u4EA7\u54C1**\uFF1Argba(0,0,0,0.2) \u80CC\u666F\uFF0C\u767D\u8272\u6587\u5B57\n\n## \uD83D\uDCF1 \u517C\u5BB9\u6027\n\n- **iOS Safari**\uFF1Awebkit-playsinline \u5185\u8054\u64AD\u653E\n- **Android Chrome**\uFF1A\u6807\u51C6 HTML5 \u89C6\u9891\u64AD\u653E\n- **\u5FAE\u4FE1/QQ \u6D4F\u89C8\u5668**\uFF1AX5 \u5185\u6838\u540C\u5C42\u64AD\u653E\uFF0C\u4E0D\u52AB\u6301\u5168\u5C4F\n- **\u684C\u9762\u6D4F\u89C8\u5668**\uFF1A\u7981\u7528\u753B\u4E2D\u753B\u548C\u8FDC\u7A0B\u64AD\u653E\n\n## \uD83C\uDFA8 \u81EA\u5B9A\u4E49\u6837\u5F0F\n\n\u7EC4\u4EF6\u63D0\u4F9B\u8BED\u4E49\u5316 className\uFF1A\n- \\`.product-compare\\` - \u7EC4\u4EF6\u5BB9\u5668\n- \\`.product-compare-title / .product-compare-subtitle\\` - \u6807\u9898/\u526F\u6807\u9898\n- \\`.product-compare-title-icon\\` - \u6807\u9898\u56FE\u6807\uFF08\u5356\u70B9\u7C7B\u578B\uFF09\n- \\`.product-compare-subtitle-image\\` - \u526F\u6807\u9898\u56FE\u7247\n- \\`.product-compare-item\\` - \u5355\u4E2A\u4EA7\u54C1\u5BB9\u5668\n- \\`.product-compare-label\\` - \u4EA7\u54C1\u6807\u7B7E\n- \\`.product-compare-media\\` - \u5A92\u4F53\u5143\u7D20\n `,\n },\n },\n },\n decorators: [\n Story => (\n <div style={{ padding: '2em' }}>\n <Story />\n </div>\n ),\n ],\n tags: ['autodocs'],\n} satisfies Meta<typeof ProductCompare>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\n// \u57FA\u7840\u6570\u636E\uFF082\u5F20\u56FE\u7247 2:3 \u6BD4\u4F8B\uFF09\nconst defaultData: ProductCompareProps['data'] = {\n title: '\u6027\u80FD\u5BF9\u6BD4',\n titleType: 'primary',\n subtitle: '\u771F\u5B9E\u573A\u666F\u4E0B\u7684\u8868\u73B0\u5DEE\u5F02',\n textAlign: 'left',\n twoImageRatio: '2:3',\n theme: 'light',\n products: [\n {\n text: '\u5176\u4ED6\u54C1\u724C',\n media: {\n url: 'https://cdn.shopify.com/videos/c/o/v/61c978092bd24ca585f8a188b77458a6.mp4',\n alt: '\u7ADE\u54C1\u6F14\u793A',\n thumbnailURL: 'https://via.placeholder.com/400x300',\n mimeType: 'video/mp4',\n height: 560,\n width: 544,\n },\n mobMedia: {\n url: 'https://cdn.shopify.com/videos/c/o/v/3f97af0b92b2434eb2d11cb0307e3d08.mp4',\n alt: '\u7ADE\u54C1\u6F14\u793A\uFF08\u79FB\u52A8\u7248\uFF09',\n thumbnailURL: 'https://via.placeholder.com/300x400',\n mimeType: 'video/mp4',\n },\n poster: 'https://via.placeholder.com/800x600/666666/ffffff?text=Competitor',\n mobPoster: 'https://via.placeholder.com/600x800/666666/ffffff?text=Competitor',\n },\n {\n text: 'Eufy E25',\n media: {\n url: 'https://cdn.shopify.com/videos/c/o/v/763f24558ba84e098b817740384a0f38.mp4',\n alt: 'Eufy E25 \u4EA7\u54C1\u6F14\u793A',\n thumbnailURL: 'https://via.placeholder.com/400x300',\n mimeType: 'video/mp4',\n height: 560,\n width: 360,\n },\n mobMedia: {\n url: 'https://cdn.shopify.com/videos/c/o/v/bb1e9dcefc9e433a8bdf70215c39eedc.mp4',\n alt: 'Eufy E25 \u4EA7\u54C1\u6F14\u793A\uFF08\u79FB\u52A8\u7248\uFF09',\n thumbnailURL: 'https://via.placeholder.com/300x400',\n mimeType: 'video/mp4',\n },\n poster: 'https://via.placeholder.com/800x600/008CD6/ffffff?text=Anker+E25',\n mobPoster: 'https://via.placeholder.com/600x800/008CD6/ffffff?text=Anker+E25',\n },\n ],\n}\n\n// \u9ED8\u8BA4\uFF1A2\u5F20\u56FE\u7247 2:3 \u6BD4\u4F8B\nexport const Default: Story = {\n args: {\n data: defaultData,\n },\n}\n\n// \u6807\u9898\u7C7B\u578B\uFF1A\u5356\u70B9\uFF08\u5E26\u56FE\u6807\uFF09\nexport const SellingPointTitle: Story = {\n args: {\n data: {\n ...defaultData,\n titleType: 'selling-point',\n title: '\u8D85\u5F3A\u7EED\u822A\u80FD\u529B',\n titleIcon: {\n url: 'https://cdn-icons-png.flaticon.com/512/1828/1828884.png',\n alt: '\u7535\u6C60\u56FE\u6807',\n mimeType: 'image/png',\n },\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u5356\u70B9\u6807\u9898\u7C7B\u578B\uFF1A\u5E26\u56FE\u6807\uFF0C\u6807\u9898\u989C\u8272\u4E3A #00BEFA',\n },\n },\n },\n}\n\n// \u6807\u9898\u7C7B\u578B\uFF1A\u4E00\u7EA7\u6807\u9898\nexport const PrimaryTitle: Story = {\n args: {\n data: {\n ...defaultData,\n titleType: 'primary',\n title: '\u6027\u80FD\u5BF9\u6BD4',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u4E00\u7EA7\u6807\u9898\u7C7B\u578B\uFF1Asize=4',\n },\n },\n },\n}\n\n// \u6807\u9898\u7C7B\u578B\uFF1A\u4E8C\u7EA7\u6807\u9898\nexport const SecondaryTitle: Story = {\n args: {\n data: {\n ...defaultData,\n titleType: 'secondary',\n title: '\u6E05\u6D01\u6548\u679C\u5BF9\u6BD4',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u4E8C\u7EA7\u6807\u9898\u7C7B\u578B\uFF1Asize=3\uFF0C\u5B57\u4F53\u8F83\u5C0F',\n },\n },\n },\n}\n\n// \u6587\u672C\u5C45\u4E2D\u5BF9\u9F50\nexport const CenterAlign: Story = {\n args: {\n data: {\n ...defaultData,\n textAlign: 'center',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u6807\u9898\u548C\u526F\u6807\u9898\u5C45\u4E2D\u5BF9\u9F50',\n },\n },\n },\n}\n\n// \u526F\u6807\u9898\u4E0B\u65B9\u5E26\u56FE\u7247\nexport const WithSubtitleImage: Story = {\n args: {\n data: {\n ...defaultData,\n subtitleImage: {\n url: 'https://via.placeholder.com/800x200/008CD6/ffffff?text=Feature+Comparison+Chart',\n alt: '\u529F\u80FD\u5BF9\u6BD4\u56FE',\n mimeType: 'image/png',\n width: 800,\n height: 200,\n },\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u5728\u526F\u6807\u9898\u4E0B\u65B9\u663E\u793A\u56FE\u7247',\n },\n },\n },\n}\n\n// 2\u5F20\u56FE\u7247 1:1 \u6BD4\u4F8B\nexport const TwoImagesEqualRatio: Story = {\n args: {\n data: {\n ...defaultData,\n twoImageRatio: '1:1',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '2\u5F20\u56FE\u7247\u7B49\u5BBD 1:1 \u6BD4\u4F8B',\n },\n },\n },\n}\n\n// 3\u5F20\u56FE\u7247 1:1:1\nexport const ThreeImages: Story = {\n args: {\n data: {\n ...defaultData,\n title: '\u591A\u4EA7\u54C1\u5BF9\u6BD4',\n subtitle: '\u4E09\u6B3E\u4EA7\u54C1\u5168\u9762\u5BF9\u6BD4',\n products: [\n {\n text: '\u54C1\u724C A',\n media: {\n url: 'https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=800&h=600&fit=crop',\n alt: '\u54C1\u724C A',\n mimeType: 'image/jpeg',\n },\n mobMedia: {\n url: 'https://images.unsplash.com/photo-1505740420928-5e560c06d30e?w=600&h=800&fit=crop',\n alt: '\u54C1\u724C A',\n mimeType: 'image/jpeg',\n },\n },\n {\n text: '\u54C1\u724C B',\n media: {\n url: 'https://images.unsplash.com/photo-1572635196237-14b3f281503f?w=800&h=600&fit=crop',\n alt: '\u54C1\u724C B',\n mimeType: 'image/jpeg',\n },\n mobMedia: {\n url: 'https://images.unsplash.com/photo-1572635196237-14b3f281503f?w=600&h=800&fit=crop',\n alt: '\u54C1\u724C B',\n mimeType: 'image/jpeg',\n },\n },\n {\n text: 'Anker \u65D7\u8230',\n media: {\n url: 'https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=800&h=600&fit=crop',\n alt: 'Anker \u65D7\u8230',\n mimeType: 'image/jpeg',\n },\n mobMedia: {\n url: 'https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=600&h=800&fit=crop',\n alt: 'Anker \u65D7\u8230',\n mimeType: 'image/jpeg',\n },\n },\n ],\n },\n },\n parameters: {\n docs: {\n description: {\n story: '3\u5F20\u56FE\u7247 1:1:1 \u7B49\u5BBD\u5E03\u5C40',\n },\n },\n },\n}\n\n// \u5E26\u5706\u89D2\n// Dark \u4E3B\u9898\nexport const DarkTheme: Story = {\n args: {\n data: {\n ...defaultData,\n theme: 'dark',\n },\n },\n parameters: {\n docs: {\n description: {\n story: 'Dark \u4E3B\u9898\u6837\u5F0F',\n },\n },\n },\n}\n\n// \u7EFC\u5408\u793A\u4F8B\uFF1A\u5356\u70B9\u6807\u9898 + \u5C45\u4E2D\u5BF9\u9F50 + \u526F\u6807\u9898\u56FE\u7247 + \u5706\u89D2\nexport const CompleteExample: Story = {\n args: {\n data: {\n titleType: 'selling-point',\n title: '\u667A\u80FD\u6E05\u6D01\u7CFB\u7EDF',\n titleIcon: {\n url: 'https://cdn-icons-png.flaticon.com/512/2917/2917995.png',\n alt: '\u667A\u80FD\u56FE\u6807',\n mimeType: 'image/png',\n },\n subtitle: '\u5168\u65B9\u4F4D\u5BF9\u6BD4\uFF0C\u770B\u89C1\u771F\u5B9E\u5DEE\u5F02',\n subtitleImage: {\n url: 'https://via.placeholder.com/600x150/008CD6/ffffff?text=AI+Powered+Cleaning',\n alt: 'AI \u6E05\u6D01\u7CFB\u7EDF',\n mimeType: 'image/png',\n width: 600,\n height: 150,\n },\n textAlign: 'center',\n theme: 'light',\n twoImageRatio: '2:3',\n products: [\n {\n text: '\u666E\u901A\u4EA7\u54C1',\n media: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=800&h=600&fit=crop',\n alt: '\u666E\u901A\u4EA7\u54C1',\n mimeType: 'image/jpeg',\n },\n mobMedia: {\n url: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=600&h=800&fit=crop',\n alt: '\u666E\u901A\u4EA7\u54C1',\n mimeType: 'image/jpeg',\n },\n },\n {\n text: 'Anker \u667A\u80FD\u7248',\n media: {\n url: 'https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=800&h=600&fit=crop',\n alt: 'Anker \u667A\u80FD\u7248',\n mimeType: 'image/jpeg',\n },\n mobMedia: {\n url: 'https://images.unsplash.com/photo-1593642632559-0c6d3fc62b89?w=600&h=800&fit=crop',\n alt: 'Anker \u667A\u80FD\u7248',\n mimeType: 'image/jpeg',\n },\n },\n ],\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u7EFC\u5408\u793A\u4F8B\uFF1A\u5C55\u793A\u591A\u79CD\u529F\u80FD\u7EC4\u5408\u4F7F\u7528',\n },\n },\n },\n}\n"],
|
|
5
|
+
"mappings": "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CF,EACA,CACE,KAAM,qBACN,MAAO,CACL,IAAK,oFACL,IAAK,qBACL,SAAU,YACZ,EACA,SAAU,CACR,IAAK,oFACL,IAAK,qBACL,SAAU,YACZ,CACF,CACF,CACF,CACF,EACA,WAAY,CACV,KAAM,CACJ,YAAa,CACX,MAAO,oDACT,CACF,CACF,CACF,EAIaf,EAAmB,CAC9B,KAAM,CACJ,KAAM,CACJ,GAAGe,EACH,MAAO,MACT,CACF,EACA,WAAY,CACV,KAAM,CACJ,YAAa,CACX,MAAO,+BACT,CACF,CACF,CACF,EAGahB,EAAyB,CACpC,KAAM,CACJ,KAAM,CACJ,UAAW,gBACX,MAAO,uCACP,UAAW,CACT,IAAK,0DACL,IAAK,2BACL,SAAU,WACZ,EACA,SAAU,2EACV,cAAe,CACb,IAAK,6EACL,IAAK,8BACL,SAAU,YACV,MAAO,IACP,OAAQ,GACV,EACA,UAAW,SACX,MAAO,QACP,cAAe,MACf,SAAU,CACR,CACE,KAAM,2BACN,MAAO,CACL,IAAK,iFACL,IAAK,2BACL,SAAU,YACZ,EACA,SAAU,CACR,IAAK,iFACL,IAAK,2BACL,SAAU,YACZ,CACF,EACA,CACE,KAAM,2BACN,MAAO,CACL,IAAK,oFACL,IAAK,2BACL,SAAU,YACZ,EACA,SAAU,CACR,IAAK,oFACL,IAAK,2BACL,SAAU,YACZ,CACF,CACF,CACF,CACF,EACA,WAAY,CACV,KAAM,CACJ,YAAa,CACX,MAAO,4FACT,CACF,CACF,CACF",
|
|
6
|
+
"names": ["productCompare_stories_exports", "__export", "CenterAlign", "CompleteExample", "DarkTheme", "Default", "PrimaryTitle", "SecondaryTitle", "SellingPointTitle", "ThreeImages", "TwoImagesEqualRatio", "WithSubtitleImage", "productCompare_stories_default", "__toCommonJS", "import_jsx_runtime", "import_ProductCompare", "meta", "ProductCompare", "Story", "defaultData"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use strict";var n=Object.create;var a=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var l=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var h=(t,o)=>{for(var e in o)a(t,e,{get:o[e],enumerable:!0})},p=(t,o,e,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of d(o))!m.call(t,r)&&r!==e&&a(t,r,{get:()=>o[r],enumerable:!(c=u(o,r))||c.enumerable});return t};var y=(t,o,e)=>(e=t!=null?n(l(t)):{},p(o||!t||!t.__esModule?a(e,"default",{value:t,enumerable:!0}):e,t)),g=t=>p(a({},"__esModule",{value:!0}),t);var P={};h(P,{CustomCTA:()=>x,Default:()=>_,LongTitle:()=>S,ShortSubtitle:()=>T,WithCustomStyles:()=>C,default:()=>f});module.exports=g(P);var H=require("react"),i=y(require("../biz-components/ProductHero/index.js"));const b={title:"Biz Components/ProductHero",component:i.default,parameters:{layout:"padded",backgrounds:{default:"dark"},docs:{description:{component:"\u4EA7\u54C1\u5C55\u793A\u7EC4\u4EF6\uFF0C\u5305\u542B\u6807\u9898\u3001\u526F\u6807\u9898\u3001CTA \u6309\u94AE\u548C\u4EA7\u54C1\u56FE\u7247"}}},tags:["autodocs"]};var f=b;const s={title:"Buy your cleaning housekeeper now",poster:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-poster.png?v=1751427172",alt:"Product Hero",thumbnailURL:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-poster.png?v=1751427172",mimeType:"image/png"},ctaLink:"/products/t2353111",ctaText:"shop now",subtitle:"The World's First HydrJet\u2122 Robot Vacuum with 20,000 Pa Turbo Suction",mobPoster:{url:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-poster.png?v=1751427222",alt:"Product Hero Mobile",thumbnailURL:"https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-poster.png?v=1751427222",mimeType:"image/png"}},_={args:{data:s}},S={args:{data:{...s,title:"Buy your advanced cleaning housekeeper with revolutionary technology now"}}},T={args:{data:{...s,subtitle:"Revolutionary Robot Vacuum"}}},x={args:{data:{...s,ctaText:"Learn More",ctaLink:"/learn-more"}}},C={args:{data:s,className:"custom-product-hero"},parameters:{docs:{description:{story:`
|
|
2
|
+
\u8BE5\u793A\u4F8B\u5C55\u793A\u4E86\u5982\u4F55\u901A\u8FC7\u6DFB\u52A0\u81EA\u5B9A\u4E49 CSS \u7C7B\u6765\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u6837\u5F0F\u3002\u7EC4\u4EF6\u4E2D\u5DF2\u6DFB\u52A0\u4EE5\u4E0B CSS \u7C7B\u4FBF\u4E8E\u6837\u5F0F\u5B9A\u5236\uFF1A
|
|
3
|
+
|
|
4
|
+
**\u6839\u5143\u7D20\uFF1A**
|
|
5
|
+
- \`.product-hero\` - \u7EC4\u4EF6\u6839\u5BB9\u5668
|
|
6
|
+
|
|
7
|
+
**\u5185\u5BB9\u533A\u57DF\uFF1A**
|
|
8
|
+
- \`.product-hero__content\` - \u5185\u5BB9\u5BB9\u5668
|
|
9
|
+
- \`.product-hero__text\` - \u6587\u672C\u5BB9\u5668
|
|
10
|
+
- \`.product-hero__title\` - \u6807\u9898
|
|
11
|
+
- \`.product-hero__subtitle\` - \u526F\u6807\u9898
|
|
12
|
+
- \`.product-hero__subtitle--desktop\` - \u684C\u9762\u7AEF\u526F\u6807\u9898\u4FEE\u9970\u7B26
|
|
13
|
+
- \`.product-hero__subtitle--mobile\` - \u79FB\u52A8\u7AEF\u526F\u6807\u9898\u4FEE\u9970\u7B26
|
|
14
|
+
|
|
15
|
+
**CTA \u6309\u94AE\uFF1A**
|
|
16
|
+
- \`.product-hero__cta-link\` - CTA \u94FE\u63A5
|
|
17
|
+
- \`.product-hero__cta-button\` - CTA \u6309\u94AE
|
|
18
|
+
|
|
19
|
+
**\u56FE\u7247\u5143\u7D20\uFF1A**
|
|
20
|
+
- \`.product-hero__image\` - \u4EA7\u54C1\u56FE\u7247
|
|
21
|
+
|
|
22
|
+
**\u793A\u4F8B CSS \u7528\u6CD5\uFF1A**
|
|
23
|
+
\`\`\`css
|
|
24
|
+
/* \u81EA\u5B9A\u4E49\u6807\u9898\u6837\u5F0F */
|
|
25
|
+
.product-hero__title {
|
|
26
|
+
font-size: 3rem;
|
|
27
|
+
font-weight: 900;
|
|
28
|
+
color: #1e293b;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
/* \u81EA\u5B9A\u4E49 CTA \u6309\u94AE */
|
|
32
|
+
.product-hero__cta-button {
|
|
33
|
+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
34
|
+
padding: 16px 32px;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
/* \u81EA\u5B9A\u4E49\u56FE\u7247\u60AC\u505C\u6548\u679C */
|
|
38
|
+
.product-hero__image:hover {
|
|
39
|
+
transform: scale(1.02);
|
|
40
|
+
transition: transform 0.4s ease;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
/* \u81EA\u5B9A\u4E49\u5185\u5BB9\u533A\u57DF */
|
|
44
|
+
.product-hero__content {
|
|
45
|
+
padding: 24px;
|
|
46
|
+
background: rgba(255, 255, 255, 0.05);
|
|
47
|
+
}
|
|
48
|
+
\`\`\`
|
|
49
|
+
`}}}};
|
|
50
|
+
//# sourceMappingURL=productHero.stories.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/stories/productHero.stories.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport ProductHero from '../biz-components/ProductHero/index.js'\nimport type { ProductHeroProps } from '../biz-components/ProductHero/types.js'\n\nconst meta = {\n title: 'Biz Components/ProductHero',\n component: ProductHero,\n parameters: {\n layout: 'padded',\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n component: '\u4EA7\u54C1\u5C55\u793A\u7EC4\u4EF6\uFF0C\u5305\u542B\u6807\u9898\u3001\u526F\u6807\u9898\u3001CTA \u6309\u94AE\u548C\u4EA7\u54C1\u56FE\u7247',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof ProductHero>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst defaultData: ProductHeroProps['data'] = {\n title: 'Buy your cleaning housekeeper now',\n poster: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-poster.png?v=1751427172',\n alt: 'Product Hero',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-poster.png?v=1751427172',\n mimeType: 'image/png',\n },\n ctaLink: '/products/t2353111',\n ctaText: 'shop now',\n subtitle: \"The World's First HydrJet\u2122 Robot Vacuum with 20,000 Pa Turbo Suction\",\n mobPoster: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-poster.png?v=1751427222',\n alt: 'Product Hero Mobile',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-poster.png?v=1751427222',\n mimeType: 'image/png',\n },\n}\n\nexport const Default: Story = {\n args: {\n data: defaultData,\n },\n}\n\nexport const LongTitle: Story = {\n args: {\n data: {\n ...defaultData,\n title: 'Buy your advanced cleaning housekeeper with revolutionary technology now',\n },\n },\n}\n\nexport const ShortSubtitle: Story = {\n args: {\n data: {\n ...defaultData,\n subtitle: 'Revolutionary Robot Vacuum',\n },\n },\n}\n\nexport const CustomCTA: Story = {\n args: {\n data: {\n ...defaultData,\n ctaText: 'Learn More',\n ctaLink: '/learn-more',\n },\n },\n}\n\nexport const WithCustomStyles: Story = {\n args: {\n data: defaultData,\n className: 'custom-product-hero',\n },\n parameters: {\n docs: {\n description: {\n story: `\n\u8BE5\u793A\u4F8B\u5C55\u793A\u4E86\u5982\u4F55\u901A\u8FC7\u6DFB\u52A0\u81EA\u5B9A\u4E49 CSS \u7C7B\u6765\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u6837\u5F0F\u3002\u7EC4\u4EF6\u4E2D\u5DF2\u6DFB\u52A0\u4EE5\u4E0B CSS \u7C7B\u4FBF\u4E8E\u6837\u5F0F\u5B9A\u5236\uFF1A\n\n**\u6839\u5143\u7D20\uFF1A**\n- \\`.product-hero\\` - \u7EC4\u4EF6\u6839\u5BB9\u5668\n\n**\u5185\u5BB9\u533A\u57DF\uFF1A**\n- \\`.product-hero__content\\` - \u5185\u5BB9\u5BB9\u5668\n- \\`.product-hero__text\\` - \u6587\u672C\u5BB9\u5668\n- \\`.product-hero__title\\` - \u6807\u9898\n- \\`.product-hero__subtitle\\` - \u526F\u6807\u9898\n- \\`.product-hero__subtitle--desktop\\` - \u684C\u9762\u7AEF\u526F\u6807\u9898\u4FEE\u9970\u7B26\n- \\`.product-hero__subtitle--mobile\\` - \u79FB\u52A8\u7AEF\u526F\u6807\u9898\u4FEE\u9970\u7B26\n\n**CTA \u6309\u94AE\uFF1A**\n- \\`.product-hero__cta-link\\` - CTA \u94FE\u63A5\n- \\`.product-hero__cta-button\\` - CTA \u6309\u94AE\n\n**\u56FE\u7247\u5143\u7D20\uFF1A**\n- \\`.product-hero__image\\` - \u4EA7\u54C1\u56FE\u7247\n\n**\u793A\u4F8B CSS \u7528\u6CD5\uFF1A**\n\\`\\`\\`css\n/* \u81EA\u5B9A\u4E49\u6807\u9898\u6837\u5F0F */\n.product-hero__title {\n font-size: 3rem;\n font-weight: 900;\n color: #1e293b;\n}\n\n/* \u81EA\u5B9A\u4E49 CTA \u6309\u94AE */\n.product-hero__cta-button {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n padding: 16px 32px;\n}\n\n/* \u81EA\u5B9A\u4E49\u56FE\u7247\u60AC\u505C\u6548\u679C */\n.product-hero__image:hover {\n transform: scale(1.02);\n transition: transform 0.4s ease;\n}\n\n/* \u81EA\u5B9A\u4E49\u5185\u5BB9\u533A\u57DF */\n.product-hero__content {\n padding: 24px;\n background: rgba(255, 255, 255, 0.05);\n}\n\\`\\`\\`\n `,\n },\n },\n },\n}\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,eAAAE,EAAA,YAAAC,EAAA,cAAAC,EAAA,kBAAAC,EAAA,qBAAAC,EAAA,YAAAC,IAAA,eAAAC,EAAAR,GAAA,IAAAS,EAAkB,iBAElBC,EAAwB,qDAGxB,MAAMC,EAAO,CACX,MAAO,6BACP,UAAW,EAAAC,QACX,WAAY,CACV,OAAQ,SACR,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,UAAW,gJACb,CACF,CACF,EACA,KAAM,CAAC,UAAU,CACnB,EAEA,IAAOL,EAAQI,EAIf,MAAME,EAAwC,CAC5C,MAAO,oCACP,OAAQ,CACN,IAAK,qFACL,IAAK,eACL,aAAc,qFACd,SAAU,WACZ,EACA,QAAS,qBACT,QAAS,WACT,SAAU,4EACV,UAAW,CACT,IAAK,yFACL,IAAK,sBACL,aAAc,yFACd,SAAU,WACZ,CACF,EAEaV,EAAiB,CAC5B,KAAM,CACJ,KAAMU,CACR,CACF,EAEaT,EAAmB,CAC9B,KAAM,CACJ,KAAM,CACJ,GAAGS,EACH,MAAO,0EACT,CACF,CACF,EAEaR,EAAuB,CAClC,KAAM,CACJ,KAAM,CACJ,GAAGQ,EACH,SAAU,4BACZ,CACF,CACF,EAEaX,EAAmB,CAC9B,KAAM,CACJ,KAAM,CACJ,GAAGW,EACH,QAAS,aACT,QAAS,aACX,CACF,CACF,EAEaP,EAA0B,CACrC,KAAM,CACJ,KAAMO,EACN,UAAW,qBACb,EACA,WAAY,CACV,KAAM,CACJ,YAAa,CACX,MAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAiDT,CACF,CACF,CACF",
|
|
6
|
+
"names": ["productHero_stories_exports", "__export", "CustomCTA", "Default", "LongTitle", "ShortSubtitle", "WithCustomStyles", "productHero_stories_default", "__toCommonJS", "import_react", "import_ProductHero", "meta", "ProductHero", "defaultData"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
"use strict";var c=Object.create;var i=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var l=Object.getPrototypeOf,d=Object.prototype.hasOwnProperty;var g=(e,o)=>{for(var n in o)i(e,n,{get:o[n],enumerable:!0})},r=(e,o,n,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let a of m(o))!d.call(e,a)&&a!==n&&i(e,a,{get:()=>o[a],enumerable:!(s=u(o,a))||s.enumerable});return e};var S=(e,o,n)=>(n=e!=null?c(l(e)):{},r(o||!e||!e.__esModule?i(n,"default",{value:e,enumerable:!0}):n,e)),b=e=>r(i({},"__esModule",{value:!0}),e);var P={};g(P,{Default:()=>R,FourProducts:()=>y,SingleProduct:()=>h,WithCustomStyles:()=>C,default:()=>M});module.exports=b(P);var D=require("react"),p=S(require("../biz-components/SpecsComparison/index.js"));const _={title:"Biz Components/SpecsComparison",component:p.default,parameters:{layout:"fullscreen",backgrounds:{default:"light"},docs:{description:{component:"\u4EA7\u54C1\u89C4\u683C\u5BF9\u6BD4\u7EC4\u4EF6\uFF0C\u5C55\u793A\u591A\u4E2A\u4EA7\u54C1\u7684\u89C4\u683C\u53C2\u6570\u5BF9\u6BD4"}}},tags:["autodocs"]};var M=_;const t={LeftMenu:{data:[{title:"",subTitle:["Clean Types","Portable Deep Cleaner","HydroJet\u2122 Mopping System","Mop Type","Downward Pressure","Rotations Per Minute","Suction Power","Auto-Detangling","Obstacle Avoidance","Omni Station","Obstacle Clearance Height","Minimum Height and Width Restrictions","Robot/Station","Run Time","App Control","Bluetooth","Wi-Fi"],isProduct:!0}]},RightMenu:{menus:[{sku:"T2353111",handle:"t2353111",subTitle:{"Wi-Fi":"\u2705","Mop Type":"Rolling Mop","Run Time":`Vacuum and Mop\uFF1A
|
|
2
|
+
125 min (Standard)
|
|
3
|
+
|
|
4
|
+
Vacuum\uFF1A
|
|
5
|
+
216 min (Standard)`,Bluetooth:"\u2705","App Control":"\u2705","Clean Types":"Vacuum and Mop","Omni Station":"\u2705","Robot/Station":`Robot:
|
|
6
|
+
12.83 \xD7 13.72 \xD7 4.40 in
|
|
7
|
+
Station\uFF1A
|
|
8
|
+
14.63 \xD7 19.07 \xD7 17.29 in`,"Suction Power":"20,000 Pa","Auto-Detangling":"DuoSpiral\u2122 Brushes","Downward Pressure":"1.5kg","Obstacle Avoidance":"RGB Camera + LED","Rotations Per Minute":"180RPM","Portable Deep Cleaner":"\u274C","Obstacle Clearance Height":"0.83 in","HydroJet\u2122 Mopping System":"\u2705","Minimum Height and Width Restrictions":"4.40 in / 12.83 in"}},{sku:"T2352111",handle:"t2352111",subTitle:{"Wi-Fi":"\u2705","Mop Type":"Rolling Mop","Run Time":`Vacuum and Mop\uFF1A
|
|
9
|
+
125 min (Standard)
|
|
10
|
+
|
|
11
|
+
Vacuum\uFF1A
|
|
12
|
+
216 min (Standard)`,Bluetooth:"\u2705","App Control":"\u2705","Clean Types":"Vacuum and Mop","Omni Station":"\u2705","Robot/Station":`Robot:
|
|
13
|
+
12.83 \xD7 13.72 \xD7 4.40 in
|
|
14
|
+
Station\uFF1A
|
|
15
|
+
14.63 \xD7 19.07 \xD7 17.29 in`,"Suction Power":"20,000 Pa","Auto-Detangling":"DuoSpiral\u2122 Brushes","Downward Pressure":"1.5kg","Obstacle Avoidance":"RGB Camera + LED","Rotations Per Minute":"180RPM","Portable Deep Cleaner":"\u2705","Obstacle Clearance Height":"0.83 in","HydroJet\u2122 Mopping System":"\u2705","Minimum Height and Width Restrictions":"4.40 in / 12.83 in"}}]},DefaultSelectMenu:{buttonText:"Buy Now"}},R={args:{data:t}},h={args:{data:{...t,RightMenu:{menus:[t.RightMenu.menus[0]]}}}},y={args:{data:{...t,RightMenu:{menus:[...t.RightMenu.menus,{sku:"T20801A1",handle:"t2080111-c",subTitle:{"Wi-Fi":"\u2705","Mop Type":"Rolling Mop","Run Time":`Vacuum and Mop\uFF1A
|
|
16
|
+
136 min (Standard)
|
|
17
|
+
|
|
18
|
+
Vacuum\uFF1A
|
|
19
|
+
216 min (Standard)`,Bluetooth:"\u2705","App Control":"\u2705","Clean Types":"Vacuum and Mop","Omni Station":"\u2705","Robot/Station":`Robot:
|
|
20
|
+
12.79 \xD7 13.66 \xD7 3.78 in
|
|
21
|
+
Station:
|
|
22
|
+
15.08 \xD7 18.39 \xD7 26.38 in`,"Suction Power":"8,000 Pa","Auto-Detangling":"Detangling Brush","Downward Pressure":"1kg","Obstacle Avoidance":"Active Binocular Infrared Camera + RGB camera","Rotations Per Minute":"170RPM","Portable Deep Cleaner":"\u274C","Obstacle Clearance Height":"0.79 in","HydroJet\u2122 Mopping System":"\u2705","Minimum Height and Width Restrictions":"4.02 in / 16.54 in"}},{sku:"T2351111",handle:"t2351111",subTitle:{"Wi-Fi":"\u2705","Mop Type":"Dual Rotating Mop Pads","Run Time":`Vacuum and Mop\uFF1A
|
|
23
|
+
136 min (Standard)
|
|
24
|
+
|
|
25
|
+
Vacuum\uFF1A
|
|
26
|
+
173 min (Standard)`,Bluetooth:"\u2705","App Control":"\u2705","Clean Types":"Vacuum and Mop","Omni Station":"\u2705","Robot/Station":`Robot:
|
|
27
|
+
12.8 \xD7 13.90 \xD7 4.47 in
|
|
28
|
+
Station\uFF1A
|
|
29
|
+
14.41 \xD7 18.90 \xD7 18.11 in`,"Suction Power":"8,000 Pa","Auto-Detangling":"Pro-Detangle Comb\u2122","Downward Pressure":"1kg","Obstacle Avoidance":"RGB Camera + LED","Rotations Per Minute":"180RPM","Portable Deep Cleaner":"\u274C","Obstacle Clearance Height":"0.83 in","HydroJet\u2122 Mopping System":"\u274C","Minimum Height and Width Restrictions":"5.12 in / 13.78 in"}}]}}}},C={args:{data:t,className:"custom-specs-comparison"},parameters:{docs:{description:{story:`
|
|
30
|
+
\u8BE5\u793A\u4F8B\u5C55\u793A\u4E86\u5982\u4F55\u901A\u8FC7\u6DFB\u52A0\u81EA\u5B9A\u4E49 CSS \u7C7B\u6765\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u6837\u5F0F\u3002\u7EC4\u4EF6\u4E2D\u5DF2\u6DFB\u52A0\u4EE5\u4E0B CSS \u7C7B\u4FBF\u4E8E\u6837\u5F0F\u5B9A\u5236\uFF1A
|
|
31
|
+
|
|
32
|
+
**\u6839\u5143\u7D20\uFF1A**
|
|
33
|
+
- \`.specs-comparison\` - \u7EC4\u4EF6\u6839\u5BB9\u5668
|
|
34
|
+
|
|
35
|
+
**\u5BB9\u5668\u5143\u7D20\uFF1A**
|
|
36
|
+
- \`.specs-comparison__container\` - \u4E3B\u5BB9\u5668
|
|
37
|
+
- \`.specs-comparison__wrapper\` - \u5185\u5BB9\u5305\u88C5\u5668
|
|
38
|
+
|
|
39
|
+
**\u4FA7\u8FB9\u680F\u5BFC\u822A\uFF1A**
|
|
40
|
+
- \`.specs-comparison__sidebar\` - \u4FA7\u8FB9\u680F\u5BB9\u5668
|
|
41
|
+
- \`.specs-comparison__nav\` - \u5BFC\u822A\u680F
|
|
42
|
+
- \`.specs-comparison__nav-item\` - \u5BFC\u822A\u9879
|
|
43
|
+
- \`.specs-comparison__nav-item--active\` - \u6FC0\u6D3B\u7684\u5BFC\u822A\u9879\u4FEE\u9970\u7B26
|
|
44
|
+
|
|
45
|
+
**\u5185\u5BB9\u533A\u57DF\uFF1A**
|
|
46
|
+
- \`.specs-comparison__content\` - \u5185\u5BB9\u5BB9\u5668
|
|
47
|
+
- \`.specs-comparison__sections\` - \u533A\u5757\u5217\u8868\u5BB9\u5668
|
|
48
|
+
- \`.specs-comparison__section\` - \u5355\u4E2A\u533A\u5757
|
|
49
|
+
- \`.specs-comparison__section-title\` - \u533A\u5757\u6807\u9898
|
|
50
|
+
|
|
51
|
+
**\u89C4\u683C\u884C\uFF1A**
|
|
52
|
+
- \`.specs-comparison__row\` - \u89C4\u683C\u53C2\u6570\u884C
|
|
53
|
+
- \`.specs-comparison__row--first\` - \u7B2C\u4E00\u884C\u4FEE\u9970\u7B26
|
|
54
|
+
- \`.specs-comparison__spec-label\` - \u89C4\u683C\u53C2\u6570\u6807\u7B7E
|
|
55
|
+
- \`.specs-comparison__values-grid\` - \u53C2\u6570\u503C\u7F51\u683C\u5BB9\u5668
|
|
56
|
+
- \`.specs-comparison__values-grid--single\` - \u5355\u5217\u7F51\u683C\u4FEE\u9970\u7B26
|
|
57
|
+
- \`.specs-comparison__values-grid--double\` - \u53CC\u5217\u7F51\u683C\u4FEE\u9970\u7B26
|
|
58
|
+
- \`.specs-comparison__value-wrapper\` - \u53C2\u6570\u503C\u5916\u5C42\u5BB9\u5668
|
|
59
|
+
- \`.specs-comparison__value\` - \u53C2\u6570\u503C\u6587\u672C
|
|
60
|
+
|
|
61
|
+
**\u793A\u4F8B CSS \u7528\u6CD5\uFF1A**
|
|
62
|
+
\`\`\`css
|
|
63
|
+
/* \u81EA\u5B9A\u4E49\u80CC\u666F\u8272 */
|
|
64
|
+
.specs-comparison {
|
|
65
|
+
background: linear-gradient(180deg, #f8f9fa 0%, #e9ecef 100%);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
/* \u81EA\u5B9A\u4E49\u5BFC\u822A\u9879\u6837\u5F0F */
|
|
69
|
+
.specs-comparison__nav-item {
|
|
70
|
+
border-left: 3px solid transparent;
|
|
71
|
+
transition: all 0.3s ease;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
.specs-comparison__nav-item--active {
|
|
75
|
+
border-left-color: #007bff;
|
|
76
|
+
background: linear-gradient(90deg, #fff 0%, rgba(0,123,255,0.05) 100%);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
/* \u81EA\u5B9A\u4E49\u89C4\u683C\u884C\u60AC\u505C\u6548\u679C */
|
|
80
|
+
.specs-comparison__row:hover {
|
|
81
|
+
background: rgba(255, 255, 255, 0.5);
|
|
82
|
+
transition: background 0.2s ease;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
/* \u81EA\u5B9A\u4E49\u89C4\u683C\u6807\u7B7E */
|
|
86
|
+
.specs-comparison__spec-label {
|
|
87
|
+
color: #495057;
|
|
88
|
+
font-weight: 600;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
/* \u81EA\u5B9A\u4E49\u53C2\u6570\u503C */
|
|
92
|
+
.specs-comparison__value {
|
|
93
|
+
color: #212529;
|
|
94
|
+
line-height: 1.6;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
/* \u81EA\u5B9A\u4E49\u533A\u5757\u6807\u9898 */
|
|
98
|
+
.specs-comparison__section-title {
|
|
99
|
+
color: #1a1a1a;
|
|
100
|
+
border-bottom: 2px solid #007bff;
|
|
101
|
+
padding-bottom: 8px;
|
|
102
|
+
}
|
|
103
|
+
\`\`\`
|
|
104
|
+
`}}}};
|
|
105
|
+
//# sourceMappingURL=specsComparison.stories.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/stories/specsComparison.stories.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport SpecsComparison from '../biz-components/SpecsComparison/index.js'\nimport type { SpecsComparisonProps } from '../biz-components/SpecsComparison/types.js'\n\nconst meta = {\n title: 'Biz Components/SpecsComparison',\n component: SpecsComparison,\n parameters: {\n layout: 'fullscreen',\n backgrounds: {\n default: 'light',\n },\n docs: {\n description: {\n component: '\u4EA7\u54C1\u89C4\u683C\u5BF9\u6BD4\u7EC4\u4EF6\uFF0C\u5C55\u793A\u591A\u4E2A\u4EA7\u54C1\u7684\u89C4\u683C\u53C2\u6570\u5BF9\u6BD4',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof SpecsComparison>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst defaultData: SpecsComparisonProps['data'] = {\n LeftMenu: {\n data: [\n {\n title: '',\n subTitle: [\n 'Clean Types',\n 'Portable Deep Cleaner',\n 'HydroJet\u2122 Mopping System',\n 'Mop Type',\n 'Downward Pressure',\n 'Rotations Per Minute',\n 'Suction Power',\n 'Auto-Detangling',\n 'Obstacle Avoidance',\n 'Omni Station',\n 'Obstacle Clearance Height',\n 'Minimum Height and Width Restrictions',\n 'Robot/Station',\n 'Run Time',\n 'App Control',\n 'Bluetooth',\n 'Wi-Fi',\n ],\n isProduct: true,\n },\n ],\n },\n RightMenu: {\n menus: [\n {\n sku: 'T2353111',\n handle: 't2353111',\n subTitle: {\n 'Wi-Fi': '\u2705',\n 'Mop Type': 'Rolling Mop',\n 'Run Time': 'Vacuum and Mop\uFF1A\\n125 min (Standard)\\n\\nVacuum\uFF1A\\n216 min (Standard)',\n Bluetooth: '\u2705',\n 'App Control': '\u2705',\n 'Clean Types': 'Vacuum and Mop',\n 'Omni Station': '\u2705',\n 'Robot/Station': 'Robot: \\n12.83 \u00D7 13.72 \u00D7 4.40 in\\nStation\uFF1A\\n14.63 \u00D7 19.07 \u00D7 17.29 in',\n 'Suction Power': '20,000 Pa',\n 'Auto-Detangling': 'DuoSpiral\u2122 Brushes',\n 'Downward Pressure': '1.5kg',\n 'Obstacle Avoidance': 'RGB Camera + LED',\n 'Rotations Per Minute': '180RPM',\n 'Portable Deep Cleaner': '\u274C',\n 'Obstacle Clearance Height': '0.83 in',\n 'HydroJet\u2122 Mopping System': '\u2705',\n 'Minimum Height and Width Restrictions': '4.40 in / 12.83 in',\n },\n },\n {\n sku: 'T2352111',\n handle: 't2352111',\n subTitle: {\n 'Wi-Fi': '\u2705',\n 'Mop Type': 'Rolling Mop',\n 'Run Time': 'Vacuum and Mop\uFF1A\\n125 min (Standard)\\n\\nVacuum\uFF1A\\n216 min (Standard)',\n Bluetooth: '\u2705',\n 'App Control': '\u2705',\n 'Clean Types': 'Vacuum and Mop',\n 'Omni Station': '\u2705',\n 'Robot/Station': 'Robot: \\n12.83 \u00D7 13.72 \u00D7 4.40 in\\nStation\uFF1A\\n14.63 \u00D7 19.07 \u00D7 17.29 in',\n 'Suction Power': '20,000 Pa',\n 'Auto-Detangling': 'DuoSpiral\u2122 Brushes',\n 'Downward Pressure': '1.5kg',\n 'Obstacle Avoidance': 'RGB Camera + LED',\n 'Rotations Per Minute': '180RPM',\n 'Portable Deep Cleaner': '\u2705',\n 'Obstacle Clearance Height': '0.83 in',\n 'HydroJet\u2122 Mopping System': '\u2705',\n 'Minimum Height and Width Restrictions': '4.40 in / 12.83 in',\n },\n },\n ],\n },\n DefaultSelectMenu: {\n buttonText: 'Buy Now',\n },\n}\n\nexport const Default: Story = {\n args: {\n data: defaultData,\n },\n}\n\nexport const SingleProduct: Story = {\n args: {\n data: {\n ...defaultData,\n RightMenu: {\n menus: [defaultData.RightMenu.menus[0]],\n },\n },\n },\n}\n\nexport const FourProducts: Story = {\n args: {\n data: {\n ...defaultData,\n RightMenu: {\n menus: [\n ...defaultData.RightMenu.menus,\n {\n sku: 'T20801A1',\n handle: 't2080111-c',\n subTitle: {\n 'Wi-Fi': '\u2705',\n 'Mop Type': 'Rolling Mop',\n 'Run Time': 'Vacuum and Mop\uFF1A\\n136 min (Standard)\\n\\nVacuum\uFF1A\\n216 min (Standard)',\n Bluetooth: '\u2705',\n 'App Control': '\u2705',\n 'Clean Types': 'Vacuum and Mop',\n 'Omni Station': '\u2705',\n 'Robot/Station': 'Robot:\\n12.79 \u00D7 13.66 \u00D7 3.78 in\\nStation:\\n15.08 \u00D7 18.39 \u00D7 26.38 in',\n 'Suction Power': '8,000 Pa',\n 'Auto-Detangling': 'Detangling Brush',\n 'Downward Pressure': '1kg',\n 'Obstacle Avoidance': 'Active Binocular Infrared Camera + RGB camera',\n 'Rotations Per Minute': '170RPM',\n 'Portable Deep Cleaner': '\u274C',\n 'Obstacle Clearance Height': '0.79 in',\n 'HydroJet\u2122 Mopping System': '\u2705',\n 'Minimum Height and Width Restrictions': '4.02 in / 16.54 in',\n },\n },\n {\n sku: 'T2351111',\n handle: 't2351111',\n subTitle: {\n 'Wi-Fi': '\u2705',\n 'Mop Type': 'Dual Rotating Mop Pads',\n 'Run Time': 'Vacuum and Mop\uFF1A\\n136 min (Standard)\\n\\nVacuum\uFF1A\\n173 min (Standard)',\n Bluetooth: '\u2705',\n 'App Control': '\u2705',\n 'Clean Types': 'Vacuum and Mop',\n 'Omni Station': '\u2705',\n 'Robot/Station': 'Robot: \\n12.8 \u00D7 13.90 \u00D7 4.47 in\\nStation\uFF1A\\n14.41 \u00D7 18.90 \u00D7 18.11 in',\n 'Suction Power': '8,000 Pa',\n 'Auto-Detangling': 'Pro-Detangle Comb\u2122',\n 'Downward Pressure': '1kg',\n 'Obstacle Avoidance': 'RGB Camera + LED',\n 'Rotations Per Minute': '180RPM',\n 'Portable Deep Cleaner': '\u274C',\n 'Obstacle Clearance Height': '0.83 in',\n 'HydroJet\u2122 Mopping System': '\u274C',\n 'Minimum Height and Width Restrictions': '5.12 in / 13.78 in',\n },\n },\n ],\n },\n },\n },\n}\n\nexport const WithCustomStyles: Story = {\n args: {\n data: defaultData,\n className: 'custom-specs-comparison',\n },\n parameters: {\n docs: {\n description: {\n story: `\n\u8BE5\u793A\u4F8B\u5C55\u793A\u4E86\u5982\u4F55\u901A\u8FC7\u6DFB\u52A0\u81EA\u5B9A\u4E49 CSS \u7C7B\u6765\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u6837\u5F0F\u3002\u7EC4\u4EF6\u4E2D\u5DF2\u6DFB\u52A0\u4EE5\u4E0B CSS \u7C7B\u4FBF\u4E8E\u6837\u5F0F\u5B9A\u5236\uFF1A\n\n**\u6839\u5143\u7D20\uFF1A**\n- \\`.specs-comparison\\` - \u7EC4\u4EF6\u6839\u5BB9\u5668\n\n**\u5BB9\u5668\u5143\u7D20\uFF1A**\n- \\`.specs-comparison__container\\` - \u4E3B\u5BB9\u5668\n- \\`.specs-comparison__wrapper\\` - \u5185\u5BB9\u5305\u88C5\u5668\n\n**\u4FA7\u8FB9\u680F\u5BFC\u822A\uFF1A**\n- \\`.specs-comparison__sidebar\\` - \u4FA7\u8FB9\u680F\u5BB9\u5668\n- \\`.specs-comparison__nav\\` - \u5BFC\u822A\u680F\n- \\`.specs-comparison__nav-item\\` - \u5BFC\u822A\u9879\n- \\`.specs-comparison__nav-item--active\\` - \u6FC0\u6D3B\u7684\u5BFC\u822A\u9879\u4FEE\u9970\u7B26\n\n**\u5185\u5BB9\u533A\u57DF\uFF1A**\n- \\`.specs-comparison__content\\` - \u5185\u5BB9\u5BB9\u5668\n- \\`.specs-comparison__sections\\` - \u533A\u5757\u5217\u8868\u5BB9\u5668\n- \\`.specs-comparison__section\\` - \u5355\u4E2A\u533A\u5757\n- \\`.specs-comparison__section-title\\` - \u533A\u5757\u6807\u9898\n\n**\u89C4\u683C\u884C\uFF1A**\n- \\`.specs-comparison__row\\` - \u89C4\u683C\u53C2\u6570\u884C\n- \\`.specs-comparison__row--first\\` - \u7B2C\u4E00\u884C\u4FEE\u9970\u7B26\n- \\`.specs-comparison__spec-label\\` - \u89C4\u683C\u53C2\u6570\u6807\u7B7E\n- \\`.specs-comparison__values-grid\\` - \u53C2\u6570\u503C\u7F51\u683C\u5BB9\u5668\n- \\`.specs-comparison__values-grid--single\\` - \u5355\u5217\u7F51\u683C\u4FEE\u9970\u7B26\n- \\`.specs-comparison__values-grid--double\\` - \u53CC\u5217\u7F51\u683C\u4FEE\u9970\u7B26\n- \\`.specs-comparison__value-wrapper\\` - \u53C2\u6570\u503C\u5916\u5C42\u5BB9\u5668\n- \\`.specs-comparison__value\\` - \u53C2\u6570\u503C\u6587\u672C\n\n**\u793A\u4F8B CSS \u7528\u6CD5\uFF1A**\n\\`\\`\\`css\n/* \u81EA\u5B9A\u4E49\u80CC\u666F\u8272 */\n.specs-comparison {\n background: linear-gradient(180deg, #f8f9fa 0%, #e9ecef 100%);\n}\n\n/* \u81EA\u5B9A\u4E49\u5BFC\u822A\u9879\u6837\u5F0F */\n.specs-comparison__nav-item {\n border-left: 3px solid transparent;\n transition: all 0.3s ease;\n}\n\n.specs-comparison__nav-item--active {\n border-left-color: #007bff;\n background: linear-gradient(90deg, #fff 0%, rgba(0,123,255,0.05) 100%);\n}\n\n/* \u81EA\u5B9A\u4E49\u89C4\u683C\u884C\u60AC\u505C\u6548\u679C */\n.specs-comparison__row:hover {\n background: rgba(255, 255, 255, 0.5);\n transition: background 0.2s ease;\n}\n\n/* \u81EA\u5B9A\u4E49\u89C4\u683C\u6807\u7B7E */\n.specs-comparison__spec-label {\n color: #495057;\n font-weight: 600;\n}\n\n/* \u81EA\u5B9A\u4E49\u53C2\u6570\u503C */\n.specs-comparison__value {\n color: #212529;\n line-height: 1.6;\n}\n\n/* \u81EA\u5B9A\u4E49\u533A\u5757\u6807\u9898 */\n.specs-comparison__section-title {\n color: #1a1a1a;\n border-bottom: 2px solid #007bff;\n padding-bottom: 8px;\n}\n\\`\\`\\`\n `,\n },\n },\n },\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["specsComparison_stories_exports", "__export", "Default", "FourProducts", "SingleProduct", "WithCustomStyles", "specsComparison_stories_default", "__toCommonJS", "import_react", "import_SpecsComparison", "meta", "SpecsComparison", "defaultData"]
|
|
7
|
+
}
|