@lexsis/storefront-components 1.0.0
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/PageRenderer.d.ts +8 -0
- package/dist/PageRenderer.d.ts.map +1 -0
- package/dist/PageRenderer.js +116 -0
- package/dist/PageRenderer.js.map +1 -0
- package/dist/SectionSkeleton.d.ts +2 -0
- package/dist/SectionSkeleton.d.ts.map +1 -0
- package/dist/SectionSkeleton.js +5 -0
- package/dist/SectionSkeleton.js.map +1 -0
- package/dist/ThemeContext.d.ts +11 -0
- package/dist/ThemeContext.d.ts.map +1 -0
- package/dist/ThemeContext.js +13 -0
- package/dist/ThemeContext.js.map +1 -0
- package/dist/ThemeProvider.d.ts +9 -0
- package/dist/ThemeProvider.d.ts.map +1 -0
- package/dist/ThemeProvider.js +227 -0
- package/dist/ThemeProvider.js.map +1 -0
- package/dist/ThemeToggle.d.ts +6 -0
- package/dist/ThemeToggle.d.ts.map +1 -0
- package/dist/ThemeToggle.js +26 -0
- package/dist/ThemeToggle.js.map +1 -0
- package/dist/animations/advanced-hooks.d.ts +36 -0
- package/dist/animations/advanced-hooks.d.ts.map +1 -0
- package/dist/animations/advanced-hooks.js +106 -0
- package/dist/animations/advanced-hooks.js.map +1 -0
- package/dist/animations/canvas-utils.d.ts +41 -0
- package/dist/animations/canvas-utils.d.ts.map +1 -0
- package/dist/animations/canvas-utils.js +115 -0
- package/dist/animations/canvas-utils.js.map +1 -0
- package/dist/animations/hooks.d.ts +48 -0
- package/dist/animations/hooks.d.ts.map +1 -0
- package/dist/animations/hooks.js +50 -0
- package/dist/animations/hooks.js.map +1 -0
- package/dist/animations/index.d.ts +4 -0
- package/dist/animations/index.d.ts.map +1 -0
- package/dist/animations/index.js +4 -0
- package/dist/animations/index.js.map +1 -0
- package/dist/animations/presets.d.ts +43 -0
- package/dist/animations/presets.d.ts.map +1 -0
- package/dist/animations/presets.js +278 -0
- package/dist/animations/presets.js.map +1 -0
- package/dist/animations/variants.d.ts +15 -0
- package/dist/animations/variants.d.ts.map +1 -0
- package/dist/animations/variants.js +90 -0
- package/dist/animations/variants.js.map +1 -0
- package/dist/backgrounds/BackgroundSection.d.ts +3 -0
- package/dist/backgrounds/BackgroundSection.d.ts.map +1 -0
- package/dist/backgrounds/BackgroundSection.js +205 -0
- package/dist/backgrounds/BackgroundSection.js.map +1 -0
- package/dist/buttons/ButtonSection.d.ts +3 -0
- package/dist/buttons/ButtonSection.d.ts.map +1 -0
- package/dist/buttons/ButtonSection.js +150 -0
- package/dist/buttons/ButtonSection.js.map +1 -0
- package/dist/cards/CardStack.d.ts +3 -0
- package/dist/cards/CardStack.d.ts.map +1 -0
- package/dist/cards/CardStack.js +140 -0
- package/dist/cards/CardStack.js.map +1 -0
- package/dist/cards/FeatureCard.d.ts +3 -0
- package/dist/cards/FeatureCard.d.ts.map +1 -0
- package/dist/cards/FeatureCard.js +100 -0
- package/dist/cards/FeatureCard.js.map +1 -0
- package/dist/cards/FeaturedCard.d.ts +3 -0
- package/dist/cards/FeaturedCard.d.ts.map +1 -0
- package/dist/cards/FeaturedCard.js +66 -0
- package/dist/cards/FeaturedCard.js.map +1 -0
- package/dist/cards/TerminalCard.d.ts +3 -0
- package/dist/cards/TerminalCard.d.ts.map +1 -0
- package/dist/cards/TerminalCard.js +73 -0
- package/dist/cards/TerminalCard.js.map +1 -0
- package/dist/cards/TestimonialCard.d.ts +3 -0
- package/dist/cards/TestimonialCard.d.ts.map +1 -0
- package/dist/cards/TestimonialCard.js +50 -0
- package/dist/cards/TestimonialCard.js.map +1 -0
- package/dist/cards/index.d.ts +2 -0
- package/dist/cards/index.d.ts.map +1 -0
- package/dist/cards/index.js +2 -0
- package/dist/cards/index.js.map +1 -0
- package/dist/cart/CartCheckoutBar.d.ts +3 -0
- package/dist/cart/CartCheckoutBar.d.ts.map +1 -0
- package/dist/cart/CartCheckoutBar.js +258 -0
- package/dist/cart/CartCheckoutBar.js.map +1 -0
- package/dist/cart/CartDiscount.d.ts +3 -0
- package/dist/cart/CartDiscount.d.ts.map +1 -0
- package/dist/cart/CartDiscount.js +78 -0
- package/dist/cart/CartDiscount.js.map +1 -0
- package/dist/cart/CartDrawer.d.ts +3 -0
- package/dist/cart/CartDrawer.d.ts.map +1 -0
- package/dist/cart/CartDrawer.js +141 -0
- package/dist/cart/CartDrawer.js.map +1 -0
- package/dist/cart/CartLines.d.ts +3 -0
- package/dist/cart/CartLines.d.ts.map +1 -0
- package/dist/cart/CartLines.js +227 -0
- package/dist/cart/CartLines.js.map +1 -0
- package/dist/cart/CartPage.d.ts +3 -0
- package/dist/cart/CartPage.d.ts.map +1 -0
- package/dist/cart/CartPage.js +128 -0
- package/dist/cart/CartPage.js.map +1 -0
- package/dist/cart/CartSummary.d.ts +3 -0
- package/dist/cart/CartSummary.d.ts.map +1 -0
- package/dist/cart/CartSummary.js +155 -0
- package/dist/cart/CartSummary.js.map +1 -0
- package/dist/cart/CartTrigger.d.ts +3 -0
- package/dist/cart/CartTrigger.d.ts.map +1 -0
- package/dist/cart/CartTrigger.js +45 -0
- package/dist/cart/CartTrigger.js.map +1 -0
- package/dist/cart/GuaranteeBanner.d.ts +3 -0
- package/dist/cart/GuaranteeBanner.d.ts.map +1 -0
- package/dist/cart/GuaranteeBanner.js +15 -0
- package/dist/cart/GuaranteeBanner.js.map +1 -0
- package/dist/cart/index.d.ts +8 -0
- package/dist/cart/index.d.ts.map +1 -0
- package/dist/cart/index.js +8 -0
- package/dist/cart/index.js.map +1 -0
- package/dist/content/BeforeAfterSlider.d.ts +3 -0
- package/dist/content/BeforeAfterSlider.d.ts.map +1 -0
- package/dist/content/BeforeAfterSlider.js +61 -0
- package/dist/content/BeforeAfterSlider.js.map +1 -0
- package/dist/content/ImageTextSplit.d.ts +3 -0
- package/dist/content/ImageTextSplit.d.ts.map +1 -0
- package/dist/content/ImageTextSplit.js +33 -0
- package/dist/content/ImageTextSplit.js.map +1 -0
- package/dist/content/LookbookGrid.d.ts +3 -0
- package/dist/content/LookbookGrid.d.ts.map +1 -0
- package/dist/content/LookbookGrid.js +183 -0
- package/dist/content/LookbookGrid.js.map +1 -0
- package/dist/content/ParallaxSection.d.ts +3 -0
- package/dist/content/ParallaxSection.d.ts.map +1 -0
- package/dist/content/ParallaxSection.js +66 -0
- package/dist/content/ParallaxSection.js.map +1 -0
- package/dist/content/RichText.d.ts +3 -0
- package/dist/content/RichText.d.ts.map +1 -0
- package/dist/content/RichText.js +21 -0
- package/dist/content/RichText.js.map +1 -0
- package/dist/content/index.d.ts +5 -0
- package/dist/content/index.d.ts.map +1 -0
- package/dist/content/index.js +5 -0
- package/dist/content/index.js.map +1 -0
- package/dist/content-types.d.ts +637 -0
- package/dist/content-types.d.ts.map +1 -0
- package/dist/content-types.js +2 -0
- package/dist/content-types.js.map +1 -0
- package/dist/context/LxCartContext.d.ts +71 -0
- package/dist/context/LxCartContext.d.ts.map +1 -0
- package/dist/context/LxCartContext.js +491 -0
- package/dist/context/LxCartContext.js.map +1 -0
- package/dist/context/LxEditorContext.d.ts +8 -0
- package/dist/context/LxEditorContext.d.ts.map +1 -0
- package/dist/context/LxEditorContext.js +10 -0
- package/dist/context/LxEditorContext.js.map +1 -0
- package/dist/context/LxPDPContext.d.ts +39 -0
- package/dist/context/LxPDPContext.d.ts.map +1 -0
- package/dist/context/LxPDPContext.js +52 -0
- package/dist/context/LxPDPContext.js.map +1 -0
- package/dist/cta/CtaFullWidth.d.ts +3 -0
- package/dist/cta/CtaFullWidth.d.ts.map +1 -0
- package/dist/cta/CtaFullWidth.js +30 -0
- package/dist/cta/CtaFullWidth.js.map +1 -0
- package/dist/cta/CtaStickyBottom.d.ts +3 -0
- package/dist/cta/CtaStickyBottom.d.ts.map +1 -0
- package/dist/cta/CtaStickyBottom.js +43 -0
- package/dist/cta/CtaStickyBottom.js.map +1 -0
- package/dist/cta/GuaranteeCta.d.ts +3 -0
- package/dist/cta/GuaranteeCta.d.ts.map +1 -0
- package/dist/cta/GuaranteeCta.js +27 -0
- package/dist/cta/GuaranteeCta.js.map +1 -0
- package/dist/cta/NewsletterSignup.d.ts +3 -0
- package/dist/cta/NewsletterSignup.d.ts.map +1 -0
- package/dist/cta/NewsletterSignup.js +35 -0
- package/dist/cta/NewsletterSignup.js.map +1 -0
- package/dist/cta/Popup.d.ts +3 -0
- package/dist/cta/Popup.d.ts.map +1 -0
- package/dist/cta/Popup.js +208 -0
- package/dist/cta/Popup.js.map +1 -0
- package/dist/cta/UrgencyCta.d.ts +3 -0
- package/dist/cta/UrgencyCta.d.ts.map +1 -0
- package/dist/cta/UrgencyCta.js +85 -0
- package/dist/cta/UrgencyCta.js.map +1 -0
- package/dist/cta/WaitlistCta.d.ts +3 -0
- package/dist/cta/WaitlistCta.d.ts.map +1 -0
- package/dist/cta/WaitlistCta.js +62 -0
- package/dist/cta/WaitlistCta.js.map +1 -0
- package/dist/cta/index.d.ts +3 -0
- package/dist/cta/index.d.ts.map +1 -0
- package/dist/cta/index.js +3 -0
- package/dist/cta/index.js.map +1 -0
- package/dist/effects/AnimatedBackground.d.ts +22 -0
- package/dist/effects/AnimatedBackground.d.ts.map +1 -0
- package/dist/effects/AnimatedBackground.js +313 -0
- package/dist/effects/AnimatedBackground.js.map +1 -0
- package/dist/effects/CanvasReveal.d.ts +5 -0
- package/dist/effects/CanvasReveal.d.ts.map +1 -0
- package/dist/effects/CanvasReveal.js +104 -0
- package/dist/effects/CanvasReveal.js.map +1 -0
- package/dist/effects/DecorativeOverlay.d.ts +10 -0
- package/dist/effects/DecorativeOverlay.d.ts.map +1 -0
- package/dist/effects/DecorativeOverlay.js +76 -0
- package/dist/effects/DecorativeOverlay.js.map +1 -0
- package/dist/effects/ScrollLinked.d.ts +3 -0
- package/dist/effects/ScrollLinked.d.ts.map +1 -0
- package/dist/effects/ScrollLinked.js +57 -0
- package/dist/effects/ScrollLinked.js.map +1 -0
- package/dist/effects/svg-library.d.ts +3 -0
- package/dist/effects/svg-library.d.ts.map +1 -0
- package/dist/effects/svg-library.js +105 -0
- package/dist/effects/svg-library.js.map +1 -0
- package/dist/faq/FaqAccordion.d.ts +3 -0
- package/dist/faq/FaqAccordion.d.ts.map +1 -0
- package/dist/faq/FaqAccordion.js +39 -0
- package/dist/faq/FaqAccordion.js.map +1 -0
- package/dist/faq/FaqTwoColumn.d.ts +3 -0
- package/dist/faq/FaqTwoColumn.d.ts.map +1 -0
- package/dist/faq/FaqTwoColumn.js +38 -0
- package/dist/faq/FaqTwoColumn.js.map +1 -0
- package/dist/faq/index.d.ts +3 -0
- package/dist/faq/index.d.ts.map +1 -0
- package/dist/faq/index.js +3 -0
- package/dist/faq/index.js.map +1 -0
- package/dist/features/BentoGrid.d.ts +3 -0
- package/dist/features/BentoGrid.d.ts.map +1 -0
- package/dist/features/BentoGrid.js +62 -0
- package/dist/features/BentoGrid.js.map +1 -0
- package/dist/features/FeatureGrid.d.ts +3 -0
- package/dist/features/FeatureGrid.d.ts.map +1 -0
- package/dist/features/FeatureGrid.js +89 -0
- package/dist/features/FeatureGrid.js.map +1 -0
- package/dist/features/FeatureTabs.d.ts +3 -0
- package/dist/features/FeatureTabs.d.ts.map +1 -0
- package/dist/features/FeatureTabs.js +64 -0
- package/dist/features/FeatureTabs.js.map +1 -0
- package/dist/features/ProcessSteps.d.ts +3 -0
- package/dist/features/ProcessSteps.d.ts.map +1 -0
- package/dist/features/ProcessSteps.js +74 -0
- package/dist/features/ProcessSteps.js.map +1 -0
- package/dist/heroes/HeroActivity.d.ts +3 -0
- package/dist/heroes/HeroActivity.d.ts.map +1 -0
- package/dist/heroes/HeroActivity.js +54 -0
- package/dist/heroes/HeroActivity.js.map +1 -0
- package/dist/heroes/HeroAnimated.d.ts +3 -0
- package/dist/heroes/HeroAnimated.d.ts.map +1 -0
- package/dist/heroes/HeroAnimated.js +101 -0
- package/dist/heroes/HeroAnimated.js.map +1 -0
- package/dist/heroes/HeroAurora.d.ts +3 -0
- package/dist/heroes/HeroAurora.d.ts.map +1 -0
- package/dist/heroes/HeroAurora.js +53 -0
- package/dist/heroes/HeroAurora.js.map +1 -0
- package/dist/heroes/HeroCarousel.d.ts +3 -0
- package/dist/heroes/HeroCarousel.d.ts.map +1 -0
- package/dist/heroes/HeroCarousel.js +187 -0
- package/dist/heroes/HeroCarousel.js.map +1 -0
- package/dist/heroes/HeroCentered.d.ts +3 -0
- package/dist/heroes/HeroCentered.d.ts.map +1 -0
- package/dist/heroes/HeroCentered.js +62 -0
- package/dist/heroes/HeroCentered.js.map +1 -0
- package/dist/heroes/HeroCinematicFullbleed.d.ts +3 -0
- package/dist/heroes/HeroCinematicFullbleed.d.ts.map +1 -0
- package/dist/heroes/HeroCinematicFullbleed.js +44 -0
- package/dist/heroes/HeroCinematicFullbleed.js.map +1 -0
- package/dist/heroes/HeroCountdown.d.ts +3 -0
- package/dist/heroes/HeroCountdown.d.ts.map +1 -0
- package/dist/heroes/HeroCountdown.js +64 -0
- package/dist/heroes/HeroCountdown.js.map +1 -0
- package/dist/heroes/HeroDarkSplitSticker.d.ts +3 -0
- package/dist/heroes/HeroDarkSplitSticker.d.ts.map +1 -0
- package/dist/heroes/HeroDarkSplitSticker.js +39 -0
- package/dist/heroes/HeroDarkSplitSticker.js.map +1 -0
- package/dist/heroes/HeroEditorial.d.ts +3 -0
- package/dist/heroes/HeroEditorial.d.ts.map +1 -0
- package/dist/heroes/HeroEditorial.js +30 -0
- package/dist/heroes/HeroEditorial.js.map +1 -0
- package/dist/heroes/HeroEditorialMinimal.d.ts +3 -0
- package/dist/heroes/HeroEditorialMinimal.d.ts.map +1 -0
- package/dist/heroes/HeroEditorialMinimal.js +47 -0
- package/dist/heroes/HeroEditorialMinimal.js.map +1 -0
- package/dist/heroes/HeroFullBleed.d.ts +3 -0
- package/dist/heroes/HeroFullBleed.d.ts.map +1 -0
- package/dist/heroes/HeroFullBleed.js +136 -0
- package/dist/heroes/HeroFullBleed.js.map +1 -0
- package/dist/heroes/HeroMini.d.ts +3 -0
- package/dist/heroes/HeroMini.d.ts.map +1 -0
- package/dist/heroes/HeroMini.js +25 -0
- package/dist/heroes/HeroMini.js.map +1 -0
- package/dist/heroes/HeroParallax.d.ts +3 -0
- package/dist/heroes/HeroParallax.d.ts.map +1 -0
- package/dist/heroes/HeroParallax.js +71 -0
- package/dist/heroes/HeroParallax.js.map +1 -0
- package/dist/heroes/HeroRetroCentered.d.ts +3 -0
- package/dist/heroes/HeroRetroCentered.d.ts.map +1 -0
- package/dist/heroes/HeroRetroCentered.js +49 -0
- package/dist/heroes/HeroRetroCentered.js.map +1 -0
- package/dist/heroes/HeroSplit.d.ts +3 -0
- package/dist/heroes/HeroSplit.d.ts.map +1 -0
- package/dist/heroes/HeroSplit.js +81 -0
- package/dist/heroes/HeroSplit.js.map +1 -0
- package/dist/heroes/HeroSpotlight.d.ts +3 -0
- package/dist/heroes/HeroSpotlight.d.ts.map +1 -0
- package/dist/heroes/HeroSpotlight.js +60 -0
- package/dist/heroes/HeroSpotlight.js.map +1 -0
- package/dist/heroes/HeroTrustSplit.d.ts +3 -0
- package/dist/heroes/HeroTrustSplit.d.ts.map +1 -0
- package/dist/heroes/HeroTrustSplit.js +53 -0
- package/dist/heroes/HeroTrustSplit.js.map +1 -0
- package/dist/heroes/HeroTypewriter.d.ts +3 -0
- package/dist/heroes/HeroTypewriter.d.ts.map +1 -0
- package/dist/heroes/HeroTypewriter.js +80 -0
- package/dist/heroes/HeroTypewriter.js.map +1 -0
- package/dist/heroes/index.d.ts +12 -0
- package/dist/heroes/index.d.ts.map +1 -0
- package/dist/heroes/index.js +12 -0
- package/dist/heroes/index.js.map +1 -0
- package/dist/index.d.ts +37 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +49 -0
- package/dist/index.js.map +1 -0
- package/dist/layout/Footer.d.ts +3 -0
- package/dist/layout/Footer.d.ts.map +1 -0
- package/dist/layout/Footer.js +75 -0
- package/dist/layout/Footer.js.map +1 -0
- package/dist/layout/Navbar.d.ts +3 -0
- package/dist/layout/Navbar.d.ts.map +1 -0
- package/dist/layout/Navbar.js +81 -0
- package/dist/layout/Navbar.js.map +1 -0
- package/dist/layout/PromoTopBar.d.ts +3 -0
- package/dist/layout/PromoTopBar.d.ts.map +1 -0
- package/dist/layout/PromoTopBar.js +201 -0
- package/dist/layout/PromoTopBar.js.map +1 -0
- package/dist/layout/SectionDivider.d.ts +3 -0
- package/dist/layout/SectionDivider.d.ts.map +1 -0
- package/dist/layout/SectionDivider.js +13 -0
- package/dist/layout/SectionDivider.js.map +1 -0
- package/dist/layout/SectionTransition.d.ts +3 -0
- package/dist/layout/SectionTransition.d.ts.map +1 -0
- package/dist/layout/SectionTransition.js +60 -0
- package/dist/layout/SectionTransition.js.map +1 -0
- package/dist/layout/Ticker.d.ts +3 -0
- package/dist/layout/Ticker.d.ts.map +1 -0
- package/dist/layout/Ticker.js +32 -0
- package/dist/layout/Ticker.js.map +1 -0
- package/dist/layout/index.d.ts +6 -0
- package/dist/layout/index.d.ts.map +1 -0
- package/dist/layout/index.js +6 -0
- package/dist/layout/index.js.map +1 -0
- package/dist/personalization/CartRecovery.d.ts +3 -0
- package/dist/personalization/CartRecovery.d.ts.map +1 -0
- package/dist/personalization/CartRecovery.js +224 -0
- package/dist/personalization/CartRecovery.js.map +1 -0
- package/dist/personalization/CohortTrustStack.d.ts +3 -0
- package/dist/personalization/CohortTrustStack.d.ts.map +1 -0
- package/dist/personalization/CohortTrustStack.js +101 -0
- package/dist/personalization/CohortTrustStack.js.map +1 -0
- package/dist/personalization/LiveActivityTicker.d.ts +3 -0
- package/dist/personalization/LiveActivityTicker.d.ts.map +1 -0
- package/dist/personalization/LiveActivityTicker.js +137 -0
- package/dist/personalization/LiveActivityTicker.js.map +1 -0
- package/dist/personalization/LoyaltyStatus.d.ts +3 -0
- package/dist/personalization/LoyaltyStatus.d.ts.map +1 -0
- package/dist/personalization/LoyaltyStatus.js +185 -0
- package/dist/personalization/LoyaltyStatus.js.map +1 -0
- package/dist/personalization/PersonalizedGreeting.d.ts +3 -0
- package/dist/personalization/PersonalizedGreeting.d.ts.map +1 -0
- package/dist/personalization/PersonalizedGreeting.js +176 -0
- package/dist/personalization/PersonalizedGreeting.js.map +1 -0
- package/dist/personalization/PersonalizedRecommendations.d.ts +3 -0
- package/dist/personalization/PersonalizedRecommendations.d.ts.map +1 -0
- package/dist/personalization/PersonalizedRecommendations.js +156 -0
- package/dist/personalization/PersonalizedRecommendations.js.map +1 -0
- package/dist/personalization/ProgressMilestone.d.ts +3 -0
- package/dist/personalization/ProgressMilestone.d.ts.map +1 -0
- package/dist/personalization/ProgressMilestone.js +127 -0
- package/dist/personalization/ProgressMilestone.js.map +1 -0
- package/dist/personalization/ReengagementBanner.d.ts +3 -0
- package/dist/personalization/ReengagementBanner.d.ts.map +1 -0
- package/dist/personalization/ReengagementBanner.js +185 -0
- package/dist/personalization/ReengagementBanner.js.map +1 -0
- package/dist/personalization/ScarcityIndicator.d.ts +3 -0
- package/dist/personalization/ScarcityIndicator.d.ts.map +1 -0
- package/dist/personalization/ScarcityIndicator.js +264 -0
- package/dist/personalization/ScarcityIndicator.js.map +1 -0
- package/dist/personalization/VipGate.d.ts +3 -0
- package/dist/personalization/VipGate.d.ts.map +1 -0
- package/dist/personalization/VipGate.js +309 -0
- package/dist/personalization/VipGate.js.map +1 -0
- package/dist/placeholder/UnknownComponent.d.ts +6 -0
- package/dist/placeholder/UnknownComponent.d.ts.map +1 -0
- package/dist/placeholder/UnknownComponent.js +5 -0
- package/dist/placeholder/UnknownComponent.js.map +1 -0
- package/dist/pricing/PricingCards.d.ts +3 -0
- package/dist/pricing/PricingCards.d.ts.map +1 -0
- package/dist/pricing/PricingCards.js +143 -0
- package/dist/pricing/PricingCards.js.map +1 -0
- package/dist/primitives/AspectBox.d.ts +12 -0
- package/dist/primitives/AspectBox.d.ts.map +1 -0
- package/dist/primitives/AspectBox.js +15 -0
- package/dist/primitives/AspectBox.js.map +1 -0
- package/dist/primitives/CursorSpotlight.d.ts +11 -0
- package/dist/primitives/CursorSpotlight.d.ts.map +1 -0
- package/dist/primitives/CursorSpotlight.js +21 -0
- package/dist/primitives/CursorSpotlight.js.map +1 -0
- package/dist/primitives/HeadlineEffect.d.ts +16 -0
- package/dist/primitives/HeadlineEffect.d.ts.map +1 -0
- package/dist/primitives/HeadlineEffect.js +187 -0
- package/dist/primitives/HeadlineEffect.js.map +1 -0
- package/dist/primitives/Marquee.d.ts +11 -0
- package/dist/primitives/Marquee.d.ts.map +1 -0
- package/dist/primitives/Marquee.js +22 -0
- package/dist/primitives/Marquee.js.map +1 -0
- package/dist/primitives/MediaFlip.d.ts +16 -0
- package/dist/primitives/MediaFlip.d.ts.map +1 -0
- package/dist/primitives/MediaFlip.js +118 -0
- package/dist/primitives/MediaFlip.js.map +1 -0
- package/dist/primitives/MediaLoop.d.ts +15 -0
- package/dist/primitives/MediaLoop.d.ts.map +1 -0
- package/dist/primitives/MediaLoop.js +31 -0
- package/dist/primitives/MediaLoop.js.map +1 -0
- package/dist/primitives/PDPGallery.d.ts +24 -0
- package/dist/primitives/PDPGallery.d.ts.map +1 -0
- package/dist/primitives/PDPGallery.js +128 -0
- package/dist/primitives/PDPGallery.js.map +1 -0
- package/dist/primitives/TiltCard.d.ts +12 -0
- package/dist/primitives/TiltCard.d.ts.map +1 -0
- package/dist/primitives/TiltCard.js +41 -0
- package/dist/primitives/TiltCard.js.map +1 -0
- package/dist/product/BundleBuilder.d.ts +3 -0
- package/dist/product/BundleBuilder.d.ts.map +1 -0
- package/dist/product/BundleBuilder.js +34 -0
- package/dist/product/BundleBuilder.js.map +1 -0
- package/dist/product/BuyBox.d.ts +3 -0
- package/dist/product/BuyBox.d.ts.map +1 -0
- package/dist/product/BuyBox.js +398 -0
- package/dist/product/BuyBox.js.map +1 -0
- package/dist/product/ComparisonTable.d.ts +3 -0
- package/dist/product/ComparisonTable.d.ts.map +1 -0
- package/dist/product/ComparisonTable.js +59 -0
- package/dist/product/ComparisonTable.js.map +1 -0
- package/dist/product/FormatGrid.d.ts +3 -0
- package/dist/product/FormatGrid.d.ts.map +1 -0
- package/dist/product/FormatGrid.js +28 -0
- package/dist/product/FormatGrid.js.map +1 -0
- package/dist/product/PDPVariants.d.ts +3 -0
- package/dist/product/PDPVariants.d.ts.map +1 -0
- package/dist/product/PDPVariants.js +284 -0
- package/dist/product/PDPVariants.js.map +1 -0
- package/dist/product/PillNav.d.ts +3 -0
- package/dist/product/PillNav.d.ts.map +1 -0
- package/dist/product/PillNav.js +35 -0
- package/dist/product/PillNav.js.map +1 -0
- package/dist/product/ProductAccordion.d.ts +3 -0
- package/dist/product/ProductAccordion.d.ts.map +1 -0
- package/dist/product/ProductAccordion.js +46 -0
- package/dist/product/ProductAccordion.js.map +1 -0
- package/dist/product/ProductCard.d.ts +62 -0
- package/dist/product/ProductCard.d.ts.map +1 -0
- package/dist/product/ProductCard.js +442 -0
- package/dist/product/ProductCard.js.map +1 -0
- package/dist/product/ProductCarousel.d.ts +3 -0
- package/dist/product/ProductCarousel.d.ts.map +1 -0
- package/dist/product/ProductCarousel.js +123 -0
- package/dist/product/ProductCarousel.js.map +1 -0
- package/dist/product/ProductCenteredStack.d.ts +3 -0
- package/dist/product/ProductCenteredStack.d.ts.map +1 -0
- package/dist/product/ProductCenteredStack.js +28 -0
- package/dist/product/ProductCenteredStack.js.map +1 -0
- package/dist/product/ProductGallery.d.ts +3 -0
- package/dist/product/ProductGallery.d.ts.map +1 -0
- package/dist/product/ProductGallery.js +80 -0
- package/dist/product/ProductGallery.js.map +1 -0
- package/dist/product/ProductGrid.d.ts +3 -0
- package/dist/product/ProductGrid.d.ts.map +1 -0
- package/dist/product/ProductGrid.js +58 -0
- package/dist/product/ProductGrid.js.map +1 -0
- package/dist/product/ProductHighlightLeft.d.ts +3 -0
- package/dist/product/ProductHighlightLeft.d.ts.map +1 -0
- package/dist/product/ProductHighlightLeft.js +37 -0
- package/dist/product/ProductHighlightLeft.js.map +1 -0
- package/dist/product/ProductHighlightRight.d.ts +3 -0
- package/dist/product/ProductHighlightRight.d.ts.map +1 -0
- package/dist/product/ProductHighlightRight.js +23 -0
- package/dist/product/ProductHighlightRight.js.map +1 -0
- package/dist/product/ProductPage.d.ts +3 -0
- package/dist/product/ProductPage.d.ts.map +1 -0
- package/dist/product/ProductPage.js +105 -0
- package/dist/product/ProductPage.js.map +1 -0
- package/dist/product/SubscriptionToggle.d.ts +3 -0
- package/dist/product/SubscriptionToggle.d.ts.map +1 -0
- package/dist/product/SubscriptionToggle.js +38 -0
- package/dist/product/SubscriptionToggle.js.map +1 -0
- package/dist/product/Upsell.d.ts +3 -0
- package/dist/product/Upsell.d.ts.map +1 -0
- package/dist/product/Upsell.js +59 -0
- package/dist/product/Upsell.js.map +1 -0
- package/dist/product/VideoCarousel.d.ts +3 -0
- package/dist/product/VideoCarousel.d.ts.map +1 -0
- package/dist/product/VideoCarousel.js +188 -0
- package/dist/product/VideoCarousel.js.map +1 -0
- package/dist/product/index.d.ts +8 -0
- package/dist/product/index.d.ts.map +1 -0
- package/dist/product/index.js +8 -0
- package/dist/product/index.js.map +1 -0
- package/dist/registry-field-schemas.d.ts +66 -0
- package/dist/registry-field-schemas.d.ts.map +1 -0
- package/dist/registry-field-schemas.js +745 -0
- package/dist/registry-field-schemas.js.map +1 -0
- package/dist/registry-metadata.d.ts +10 -0
- package/dist/registry-metadata.d.ts.map +1 -0
- package/dist/registry-metadata.js +2 -0
- package/dist/registry-metadata.js.map +1 -0
- package/dist/registry.d.ts +20 -0
- package/dist/registry.d.ts.map +1 -0
- package/dist/registry.js +2317 -0
- package/dist/registry.js.map +1 -0
- package/dist/renderText.d.ts +6 -0
- package/dist/renderText.d.ts.map +1 -0
- package/dist/renderText.js +23 -0
- package/dist/renderText.js.map +1 -0
- package/dist/reviews/ReviewCarousel.d.ts +3 -0
- package/dist/reviews/ReviewCarousel.d.ts.map +1 -0
- package/dist/reviews/ReviewCarousel.js +24 -0
- package/dist/reviews/ReviewCarousel.js.map +1 -0
- package/dist/reviews/ReviewMasonry.d.ts +3 -0
- package/dist/reviews/ReviewMasonry.d.ts.map +1 -0
- package/dist/reviews/ReviewMasonry.js +25 -0
- package/dist/reviews/ReviewMasonry.js.map +1 -0
- package/dist/reviews/ReviewSpotlight.d.ts +3 -0
- package/dist/reviews/ReviewSpotlight.d.ts.map +1 -0
- package/dist/reviews/ReviewSpotlight.js +13 -0
- package/dist/reviews/ReviewSpotlight.js.map +1 -0
- package/dist/reviews/VideoTestimonials.d.ts +3 -0
- package/dist/reviews/VideoTestimonials.d.ts.map +1 -0
- package/dist/reviews/VideoTestimonials.js +35 -0
- package/dist/reviews/VideoTestimonials.js.map +1 -0
- package/dist/reviews/index.d.ts +4 -0
- package/dist/reviews/index.d.ts.map +1 -0
- package/dist/reviews/index.js +4 -0
- package/dist/reviews/index.js.map +1 -0
- package/dist/schemas/content.d.ts +125 -0
- package/dist/schemas/content.d.ts.map +1 -0
- package/dist/schemas/content.js +2 -0
- package/dist/schemas/content.js.map +1 -0
- package/dist/schemas/index.d.ts +3 -0
- package/dist/schemas/index.d.ts.map +1 -0
- package/dist/schemas/index.js +2 -0
- package/dist/schemas/index.js.map +1 -0
- package/dist/schemas/settings.d.ts +23 -0
- package/dist/schemas/settings.d.ts.map +1 -0
- package/dist/schemas/settings.js +321 -0
- package/dist/schemas/settings.js.map +1 -0
- package/dist/social-proof/AvatarGroup.d.ts +3 -0
- package/dist/social-proof/AvatarGroup.d.ts.map +1 -0
- package/dist/social-proof/AvatarGroup.js +58 -0
- package/dist/social-proof/AvatarGroup.js.map +1 -0
- package/dist/social-proof/LogoCarousel.d.ts +3 -0
- package/dist/social-proof/LogoCarousel.d.ts.map +1 -0
- package/dist/social-proof/LogoCarousel.js +49 -0
- package/dist/social-proof/LogoCarousel.js.map +1 -0
- package/dist/social-proof/LogoStrip.d.ts +3 -0
- package/dist/social-proof/LogoStrip.d.ts.map +1 -0
- package/dist/social-proof/LogoStrip.js +35 -0
- package/dist/social-proof/LogoStrip.js.map +1 -0
- package/dist/social-proof/PressMentions.d.ts +3 -0
- package/dist/social-proof/PressMentions.d.ts.map +1 -0
- package/dist/social-proof/PressMentions.js +40 -0
- package/dist/social-proof/PressMentions.js.map +1 -0
- package/dist/social-proof/StatsGrid.d.ts +3 -0
- package/dist/social-proof/StatsGrid.d.ts.map +1 -0
- package/dist/social-proof/StatsGrid.js +39 -0
- package/dist/social-proof/StatsGrid.js.map +1 -0
- package/dist/social-proof/TrustBadges.d.ts +3 -0
- package/dist/social-proof/TrustBadges.d.ts.map +1 -0
- package/dist/social-proof/TrustBadges.js +18 -0
- package/dist/social-proof/TrustBadges.js.map +1 -0
- package/dist/social-proof/index.d.ts +4 -0
- package/dist/social-proof/index.d.ts.map +1 -0
- package/dist/social-proof/index.js +4 -0
- package/dist/social-proof/index.js.map +1 -0
- package/dist/text-effects/TextEffect.d.ts +3 -0
- package/dist/text-effects/TextEffect.d.ts.map +1 -0
- package/dist/text-effects/TextEffect.js +277 -0
- package/dist/text-effects/TextEffect.js.map +1 -0
- package/dist/theme/resolve.d.ts +12 -0
- package/dist/theme/resolve.d.ts.map +1 -0
- package/dist/theme/resolve.js +26 -0
- package/dist/theme/resolve.js.map +1 -0
- package/dist/theme/tokens.d.ts +147 -0
- package/dist/theme/tokens.d.ts.map +1 -0
- package/dist/theme/tokens.js +113 -0
- package/dist/theme/tokens.js.map +1 -0
- package/dist/types.d.ts +154 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -0
- package/dist/utils/elementStyles.d.ts +4 -0
- package/dist/utils/elementStyles.d.ts.map +1 -0
- package/dist/utils/elementStyles.js +6 -0
- package/dist/utils/elementStyles.js.map +1 -0
- package/dist/utils/icon-map.d.ts +128 -0
- package/dist/utils/icon-map.d.ts.map +1 -0
- package/dist/utils/icon-map.js +199 -0
- package/dist/utils/icon-map.js.map +1 -0
- package/dist/utils/imageStyle.d.ts +4 -0
- package/dist/utils/imageStyle.d.ts.map +1 -0
- package/dist/utils/imageStyle.js +23 -0
- package/dist/utils/imageStyle.js.map +1 -0
- package/dist/utils/renderIcon.d.ts +32 -0
- package/dist/utils/renderIcon.d.ts.map +1 -0
- package/dist/utils/renderIcon.js +188 -0
- package/dist/utils/renderIcon.js.map +1 -0
- package/dist/utils/schemaUtils.d.ts +9 -0
- package/dist/utils/schemaUtils.d.ts.map +1 -0
- package/dist/utils/schemaUtils.js +10 -0
- package/dist/utils/schemaUtils.js.map +1 -0
- package/dist/value-props/HowItWorks.d.ts +3 -0
- package/dist/value-props/HowItWorks.d.ts.map +1 -0
- package/dist/value-props/HowItWorks.js +23 -0
- package/dist/value-props/HowItWorks.js.map +1 -0
- package/dist/value-props/NumberedList.d.ts +3 -0
- package/dist/value-props/NumberedList.d.ts.map +1 -0
- package/dist/value-props/NumberedList.js +22 -0
- package/dist/value-props/NumberedList.js.map +1 -0
- package/dist/value-props/ValuePropsAlternating.d.ts +3 -0
- package/dist/value-props/ValuePropsAlternating.d.ts.map +1 -0
- package/dist/value-props/ValuePropsAlternating.js +22 -0
- package/dist/value-props/ValuePropsAlternating.js.map +1 -0
- package/dist/value-props/ValuePropsGrid.d.ts +3 -0
- package/dist/value-props/ValuePropsGrid.d.ts.map +1 -0
- package/dist/value-props/ValuePropsGrid.js +23 -0
- package/dist/value-props/ValuePropsGrid.js.map +1 -0
- package/dist/value-props/ValuePropsIconStrip.d.ts +3 -0
- package/dist/value-props/ValuePropsIconStrip.d.ts.map +1 -0
- package/dist/value-props/ValuePropsIconStrip.js +11 -0
- package/dist/value-props/ValuePropsIconStrip.js.map +1 -0
- package/dist/value-props/index.d.ts +6 -0
- package/dist/value-props/index.d.ts.map +1 -0
- package/dist/value-props/index.js +6 -0
- package/dist/value-props/index.js.map +1 -0
- package/package.json +46 -0
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState, useRef } from "react";
|
|
3
|
+
import { renderText } from "../renderText";
|
|
4
|
+
import { elStyle } from "../utils/elementStyles";
|
|
5
|
+
export default function ButtonSection({ content, variant, theme, elementStyles }) {
|
|
6
|
+
const text = renderText(content.text);
|
|
7
|
+
const url = renderText(content.url);
|
|
8
|
+
const secondaryText = renderText(content.secondary_text);
|
|
9
|
+
const secondaryUrl = renderText(content.secondary_url);
|
|
10
|
+
const icon = renderText(content.icon);
|
|
11
|
+
const heading = renderText(content.heading);
|
|
12
|
+
const subhead = renderText(content.subhead);
|
|
13
|
+
const accent = theme.palette.accent;
|
|
14
|
+
const highlight = theme.palette.highlight;
|
|
15
|
+
const secondary = theme.palette.secondary ?? "#6b7280";
|
|
16
|
+
const bg = theme.palette.bg;
|
|
17
|
+
const textColor = theme.palette.text;
|
|
18
|
+
const btnBase = {
|
|
19
|
+
fontFamily: theme.fonts.body,
|
|
20
|
+
cursor: "pointer",
|
|
21
|
+
border: "none",
|
|
22
|
+
padding: theme.button?.padding ?? "var(--lx-buttonsection-padding-y, var(--lx-space-3)) var(--lx-buttonsection-padding-x, var(--lx-space-xl))",
|
|
23
|
+
borderRadius: theme.button?.radius ?? "var(--lx-buttonsection-radius, var(--lx-radius-md))",
|
|
24
|
+
fontSize: "1rem",
|
|
25
|
+
fontWeight: 600,
|
|
26
|
+
transition: "all 0.2s ease",
|
|
27
|
+
};
|
|
28
|
+
function Wrapper({ children }) {
|
|
29
|
+
return (_jsxs("section", { style: { backgroundColor: bg, padding: "var(--lx-buttonsection-section-padding-y, var(--lx-space-2xl)) var(--lx-buttonsection-section-padding-x, var(--lx-space-5))", textAlign: "center" }, children: [heading && (_jsx("h2", { "data-lx-field": "heading", style: { fontFamily: theme.fonts.display, color: textColor, fontSize: "2rem", fontWeight: 700, marginBottom: "var(--lx-buttonsection-heading-margin-bottom, var(--lx-space-sm))", ...elStyle(elementStyles, "heading") }, children: heading })), subhead && (_jsx("p", { "data-lx-field": "subhead", style: { fontFamily: theme.fonts.body, color: textColor, opacity: 0.7, fontSize: "1.1rem", marginBottom: "var(--lx-buttonsection-subhead-margin-bottom, var(--lx-space-lg))", ...elStyle(elementStyles, "subhead") }, children: subhead })), children] }));
|
|
30
|
+
}
|
|
31
|
+
if (variant === "magnetic") {
|
|
32
|
+
const btnRef = useRef(null);
|
|
33
|
+
const [offset, setOffset] = useState({ x: 0, y: 0 });
|
|
34
|
+
const [hovered, setHovered] = useState(false);
|
|
35
|
+
function handleMouseMove(e) {
|
|
36
|
+
const el = btnRef.current;
|
|
37
|
+
if (!el)
|
|
38
|
+
return;
|
|
39
|
+
const rect = el.getBoundingClientRect();
|
|
40
|
+
const cx = rect.left + rect.width / 2;
|
|
41
|
+
const cy = rect.top + rect.height / 2;
|
|
42
|
+
setOffset({ x: (e.clientX - cx) * 0.3, y: (e.clientY - cy) * 0.3 });
|
|
43
|
+
}
|
|
44
|
+
return (_jsx(Wrapper, { children: _jsxs("button", { ref: btnRef, onMouseMove: handleMouseMove, onMouseEnter: () => setHovered(true), onMouseLeave: () => { setHovered(false); setOffset({ x: 0, y: 0 }); }, style: {
|
|
45
|
+
...btnBase,
|
|
46
|
+
backgroundColor: accent,
|
|
47
|
+
color: "#fff",
|
|
48
|
+
transform: `translate(${offset.x}px, ${offset.y}px)`,
|
|
49
|
+
transition: hovered ? "transform 0.1s ease" : "transform 0.4s ease",
|
|
50
|
+
}, children: [icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text })] }) }));
|
|
51
|
+
}
|
|
52
|
+
if (variant === "moving_border") {
|
|
53
|
+
return (_jsxs(Wrapper, { children: [_jsx("style", { children: `
|
|
54
|
+
@keyframes spinBorder { to { transform: rotate(360deg); } }
|
|
55
|
+
` }), _jsxs("div", { style: { display: "inline-block", position: "relative", borderRadius: "var(--lx-buttonsection-border-radius, var(--lx-radius-full))", padding: "3px", overflow: "hidden" }, children: [_jsx("div", { style: {
|
|
56
|
+
position: "absolute",
|
|
57
|
+
inset: "-50%",
|
|
58
|
+
background: `conic-gradient(from 0deg, ${accent}, ${highlight}, ${secondary}, ${accent})`,
|
|
59
|
+
animation: "spinBorder 3s linear infinite",
|
|
60
|
+
} }), _jsxs("button", { style: {
|
|
61
|
+
...btnBase,
|
|
62
|
+
position: "relative",
|
|
63
|
+
zIndex: 10,
|
|
64
|
+
backgroundColor: theme.palette.surface,
|
|
65
|
+
color: textColor,
|
|
66
|
+
borderRadius: "var(--lx-buttonsection-border-radius, var(--lx-radius-full))",
|
|
67
|
+
}, children: [icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text })] })] })] }));
|
|
68
|
+
}
|
|
69
|
+
if (variant === "shimmer") {
|
|
70
|
+
return (_jsxs(Wrapper, { children: [_jsx("style", { children: `
|
|
71
|
+
@keyframes shimmerSweep { from { left: -80px; } to { left: 110%; } }
|
|
72
|
+
` }), _jsxs("button", { style: {
|
|
73
|
+
...btnBase,
|
|
74
|
+
backgroundColor: accent,
|
|
75
|
+
color: "#fff",
|
|
76
|
+
position: "relative",
|
|
77
|
+
overflow: "hidden",
|
|
78
|
+
}, children: [_jsx("span", { style: {
|
|
79
|
+
position: "absolute",
|
|
80
|
+
top: 0,
|
|
81
|
+
height: "100%",
|
|
82
|
+
width: "80px",
|
|
83
|
+
transform: "skewX(-20deg)",
|
|
84
|
+
backgroundColor: "rgba(255,255,255,0.3)",
|
|
85
|
+
animation: "shimmerSweep 2.5s ease-in-out infinite",
|
|
86
|
+
} }), icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text })] })] }));
|
|
87
|
+
}
|
|
88
|
+
if (variant === "stateful") {
|
|
89
|
+
const [status, setStatus] = useState("idle");
|
|
90
|
+
function handleClick() {
|
|
91
|
+
setStatus("loading");
|
|
92
|
+
setTimeout(() => {
|
|
93
|
+
setStatus("success");
|
|
94
|
+
setTimeout(() => setStatus("idle"), 1500);
|
|
95
|
+
}, 1500);
|
|
96
|
+
}
|
|
97
|
+
return (_jsxs(Wrapper, { children: [_jsx("style", { children: `
|
|
98
|
+
@keyframes spinIcon { to { transform: rotate(360deg); } }
|
|
99
|
+
` }), _jsxs("button", { onClick: handleClick, disabled: status === "loading", style: { ...btnBase, backgroundColor: status === "success" ? "#16a34a" : accent, color: "#fff", opacity: status === "loading" ? 0.8 : 1, minWidth: "160px" }, children: [status === "loading" && (_jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", style: { animation: "spinIcon 0.8s linear infinite", display: "inline-block", marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))", verticalAlign: "middle" }, children: [_jsx("circle", { cx: "12", cy: "12", r: "10", strokeOpacity: "0.3" }), _jsx("path", { d: "M12 2a10 10 0 0 1 10 10" })] })), status === "success" && (_jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", style: { display: "inline-block", marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))", verticalAlign: "middle" }, children: _jsx("polyline", { points: "20 6 9 17 4 12" }) })), status === "idle" && _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text }), status === "loading" && "Loading...", status === "success" && "Done!"] })] }));
|
|
100
|
+
}
|
|
101
|
+
if (variant === "pulse_cta") {
|
|
102
|
+
return (_jsxs(Wrapper, { children: [_jsx("style", { children: `
|
|
103
|
+
@keyframes pulseRing {
|
|
104
|
+
0%, 100% { box-shadow: 0 0 0 0 ${accent}60; }
|
|
105
|
+
50% { box-shadow: 0 0 0 12px ${accent}00; }
|
|
106
|
+
}
|
|
107
|
+
` }), _jsx("a", { href: url || "#", style: { textDecoration: "none" }, children: _jsxs("button", { style: {
|
|
108
|
+
...btnBase,
|
|
109
|
+
backgroundColor: accent,
|
|
110
|
+
color: "#fff",
|
|
111
|
+
animation: "pulseRing 2s ease infinite",
|
|
112
|
+
}, children: [icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text })] }) })] }));
|
|
113
|
+
}
|
|
114
|
+
if (variant === "glow_cta") {
|
|
115
|
+
const [hovered, setHovered] = useState(false);
|
|
116
|
+
return (_jsx(Wrapper, { children: _jsx("a", { href: url || "#", style: { textDecoration: "none" }, children: _jsxs("button", { onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), style: {
|
|
117
|
+
...btnBase,
|
|
118
|
+
backgroundColor: accent,
|
|
119
|
+
color: "#fff",
|
|
120
|
+
boxShadow: hovered ? `0 0 40px ${accent}` : "none",
|
|
121
|
+
transition: "box-shadow 0.3s ease",
|
|
122
|
+
}, children: [icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text })] }) }) }));
|
|
123
|
+
}
|
|
124
|
+
if (variant === "primary_secondary") {
|
|
125
|
+
return (_jsx(Wrapper, { children: _jsxs("div", { style: { display: "flex", gap: "var(--lx-buttonsection-gap, var(--lx-space-md))", flexWrap: "wrap", justifyContent: "center" }, children: [_jsx("a", { href: url || "#", style: { textDecoration: "none" }, children: _jsxs("button", { style: { ...btnBase, backgroundColor: accent, color: "#fff" }, children: [icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text })] }) }), secondaryText && (_jsx("a", { href: secondaryUrl || "#", style: { textDecoration: "none" }, children: _jsx("button", { style: {
|
|
126
|
+
...btnBase,
|
|
127
|
+
backgroundColor: "transparent",
|
|
128
|
+
color: accent,
|
|
129
|
+
border: `2px solid ${accent}`,
|
|
130
|
+
}, onMouseEnter: e => {
|
|
131
|
+
e.currentTarget.style.backgroundColor = accent;
|
|
132
|
+
e.currentTarget.style.color = "#fff";
|
|
133
|
+
}, onMouseLeave: e => {
|
|
134
|
+
e.currentTarget.style.backgroundColor = "transparent";
|
|
135
|
+
e.currentTarget.style.color = accent;
|
|
136
|
+
}, children: _jsx("span", { "data-lx-field": "secondary_text", style: { ...elStyle(elementStyles, "secondary_text") }, children: secondaryText }) }) }))] }) }));
|
|
137
|
+
}
|
|
138
|
+
if (variant === "icon_arrow") {
|
|
139
|
+
const [hovered, setHovered] = useState(false);
|
|
140
|
+
return (_jsx(Wrapper, { children: _jsx("a", { href: url || "#", style: { textDecoration: "none" }, children: _jsxs("button", { onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), style: { ...btnBase, backgroundColor: accent, color: "#fff" }, children: [icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text }), _jsx("span", { style: {
|
|
141
|
+
display: "inline-block",
|
|
142
|
+
marginLeft: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))",
|
|
143
|
+
transform: hovered ? "translateX(4px)" : "translateX(0)",
|
|
144
|
+
transition: "transform 0.2s ease",
|
|
145
|
+
}, children: "\u2192" })] }) }) }));
|
|
146
|
+
}
|
|
147
|
+
// fallback: plain primary
|
|
148
|
+
return (_jsx(Wrapper, { children: _jsx("a", { href: url || "#", style: { textDecoration: "none" }, children: _jsxs("button", { style: { ...btnBase, backgroundColor: accent, color: "#fff" }, children: [icon && _jsx("span", { style: { marginRight: "var(--lx-buttonsection-icon-gap, var(--lx-space-sm))" }, children: icon }), _jsx("span", { "data-lx-field": "text", style: { ...elStyle(elementStyles, "text") }, children: text })] }) }) }));
|
|
149
|
+
}
|
|
150
|
+
//# sourceMappingURL=ButtonSection.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ButtonSection.js","sourceRoot":"","sources":["../../src/buttons/ButtonSection.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardStack.d.ts","sourceRoot":"","sources":["../../src/cards/CardStack.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAa/C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,cAAc,2CAuO3F"}
|
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState, useEffect, useRef } from "react";
|
|
3
|
+
import { renderText } from "../renderText";
|
|
4
|
+
import { elStyle } from "../utils/elementStyles";
|
|
5
|
+
export default function CardStack({ content, variant, theme, elementStyles }) {
|
|
6
|
+
const heading = renderText(content.heading);
|
|
7
|
+
const rawCards = content.cards || [];
|
|
8
|
+
const cards = rawCards.slice(0, 4);
|
|
9
|
+
const accent = theme.palette.accent;
|
|
10
|
+
const surface = theme.palette.surface;
|
|
11
|
+
const textColor = theme.palette.text;
|
|
12
|
+
const border = theme.palette.border ?? "#e5e7eb";
|
|
13
|
+
function CardEl({ card, style, showFull }) {
|
|
14
|
+
return (_jsxs("div", { style: {
|
|
15
|
+
backgroundColor: renderText(card.color) || surface,
|
|
16
|
+
border: `1px solid ${border}`,
|
|
17
|
+
borderRadius: theme.card?.radius ?? "var(--lx-productcard-radius, var(--lx-radius-xl))",
|
|
18
|
+
padding: "var(--lx-productcard-padding, var(--lx-space-lg))",
|
|
19
|
+
position: "relative",
|
|
20
|
+
...style,
|
|
21
|
+
}, children: [card.badge && (_jsx("div", { style: {
|
|
22
|
+
position: "absolute",
|
|
23
|
+
top: "var(--lx-productcard-badge-offset, var(--lx-space-3))",
|
|
24
|
+
right: "var(--lx-productcard-badge-offset, var(--lx-space-3))",
|
|
25
|
+
backgroundColor: accent,
|
|
26
|
+
color: "#fff",
|
|
27
|
+
padding: "4px 10px",
|
|
28
|
+
borderRadius: "var(--lx-productcard-badge-radius, var(--lx-radius-full))",
|
|
29
|
+
fontSize: "0.75rem",
|
|
30
|
+
fontWeight: 600,
|
|
31
|
+
fontFamily: theme.fonts.body,
|
|
32
|
+
}, children: renderText(card.badge) })), card.icon && _jsx("div", { style: { fontSize: "1.5rem", marginBottom: "var(--lx-productcard-icon-gap, var(--lx-space-sm))" }, children: renderText(card.icon) }), card.image_url && showFull && (_jsx("img", { src: renderText(card.image_url), alt: "", style: { width: "100%", borderRadius: theme.image?.radius ?? "var(--lx-radius-md)", marginBottom: "var(--lx-productcard-image-gap, var(--lx-space-3))", objectFit: "cover", height: "120px" } })), _jsx("div", { "data-lx-field": "title", style: { fontFamily: theme.fonts.display, fontWeight: 700, color: textColor, fontSize: "1.1rem", ...elStyle(elementStyles, "title") }, children: renderText(card.title) }), showFull && _jsx("div", { "data-lx-field": "body", style: { fontFamily: theme.fonts.body, color: textColor, opacity: 0.7, marginTop: "var(--lx-productcard-body-gap, var(--lx-space-sm))", fontSize: "0.95rem", ...elStyle(elementStyles, "body") }, children: renderText(card.body) })] }));
|
|
33
|
+
}
|
|
34
|
+
if (variant === "vertical_stack") {
|
|
35
|
+
const [hovered, setHovered] = useState(false);
|
|
36
|
+
const stackConfig = [
|
|
37
|
+
{ zIndex: 50, translateY: hovered ? -10 : 0, scaleX: 1, opacity: 1, showFull: true },
|
|
38
|
+
{ zIndex: 40, translateY: 12, scaleX: 0.95, opacity: 0.8, showFull: false },
|
|
39
|
+
{ zIndex: 30, translateY: 24, scaleX: 0.90, opacity: 0.6, showFull: false },
|
|
40
|
+
{ zIndex: 20, translateY: 36, scaleX: 0.85, opacity: 0.4, showFull: false },
|
|
41
|
+
];
|
|
42
|
+
return (_jsxs("section", { style: { backgroundColor: theme.palette.bg, padding: "var(--lx-productcard-section-padding-y, var(--lx-space-2xl)) var(--lx-productcard-section-padding-x, var(--lx-space-5))" }, children: [heading && _jsx("h2", { "data-lx-field": "heading", style: { fontFamily: theme.fonts.display, color: textColor, textAlign: "center", fontSize: "2rem", fontWeight: 700, marginBottom: "var(--lx-productcard-heading-gap, var(--lx-space-xl))", ...elStyle(elementStyles, "heading") }, children: heading }), _jsx("div", { onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), style: { position: "relative", height: "280px", maxWidth: "480px", margin: "0 auto" }, children: cards.map((card, i) => {
|
|
43
|
+
const cfg = stackConfig[i];
|
|
44
|
+
if (!cfg)
|
|
45
|
+
return null;
|
|
46
|
+
return (_jsx("div", { style: { position: "absolute", width: "100%", zIndex: cfg.zIndex, transform: `translateY(${cfg.translateY}px) scaleX(${cfg.scaleX})`, opacity: cfg.opacity, transition: "transform 0.3s ease, opacity 0.3s ease" }, children: _jsx(CardEl, { card: card, style: {}, showFull: cfg.showFull }) }, i));
|
|
47
|
+
}) })] }));
|
|
48
|
+
}
|
|
49
|
+
if (variant === "reveal_on_scroll") {
|
|
50
|
+
const [visibleSet, setVisibleSet] = useState(new Set());
|
|
51
|
+
const cardRefs = useRef([]);
|
|
52
|
+
useEffect(() => {
|
|
53
|
+
const observer = new IntersectionObserver((entries) => {
|
|
54
|
+
entries.forEach((entry) => {
|
|
55
|
+
const idx = cardRefs.current.indexOf(entry.target);
|
|
56
|
+
if (entry.isIntersecting && idx !== -1) {
|
|
57
|
+
setVisibleSet((prev) => new Set([...prev, idx]));
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
}, { threshold: 0.2 });
|
|
61
|
+
cardRefs.current.forEach((el) => { if (el)
|
|
62
|
+
observer.observe(el); });
|
|
63
|
+
return () => observer.disconnect();
|
|
64
|
+
}, []);
|
|
65
|
+
return (_jsxs("section", { style: { backgroundColor: theme.palette.bg, padding: "var(--lx-productcard-section-padding-y, var(--lx-space-2xl)) var(--lx-productcard-section-padding-x, var(--lx-space-5))" }, children: [heading && _jsx("h2", { "data-lx-field": "heading", style: { fontFamily: theme.fonts.display, color: textColor, textAlign: "center", fontSize: "2rem", fontWeight: 700, marginBottom: "var(--lx-productcard-heading-gap, var(--lx-space-xl))", ...elStyle(elementStyles, "heading") }, children: heading }), _jsx("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lx-productcard-stack-gap, var(--lx-space-5))", maxWidth: "640px", margin: "0 auto" }, children: (content.cards || []).map((card, i) => (_jsx("div", { ref: (el) => { cardRefs.current[i] = el; }, style: {
|
|
66
|
+
opacity: visibleSet.has(i) ? 1 : 0,
|
|
67
|
+
transform: visibleSet.has(i) ? "translateY(0)" : "translateY(40px)",
|
|
68
|
+
transition: `all 0.5s ease ${i * 0.15}s`,
|
|
69
|
+
}, children: _jsx(CardEl, { card: card, style: {}, showFull: true }) }, i))) })] }));
|
|
70
|
+
}
|
|
71
|
+
if (variant === "fan_out") {
|
|
72
|
+
const [spread, setSpread] = useState(false);
|
|
73
|
+
const [selectedCard, setSelectedCard] = useState(null);
|
|
74
|
+
const midIndex = Math.floor(cards.length / 2);
|
|
75
|
+
return (_jsxs("section", { style: { backgroundColor: theme.palette.bg, padding: "var(--lx-productcard-section-padding-y, var(--lx-space-2xl)) var(--lx-productcard-section-padding-x, var(--lx-space-5))" }, children: [_jsx("style", { children: `
|
|
76
|
+
@keyframes expandCard {
|
|
77
|
+
from { opacity: 0; max-height: 0; }
|
|
78
|
+
to { opacity: 1; max-height: 200px; }
|
|
79
|
+
}
|
|
80
|
+
` }), heading && _jsx("h2", { "data-lx-field": "heading", style: { fontFamily: theme.fonts.display, color: textColor, textAlign: "center", fontSize: "2rem", fontWeight: 700, marginBottom: "var(--lx-productcard-heading-gap, var(--lx-space-xl))", ...elStyle(elementStyles, "heading") }, children: heading }), _jsx("div", { onMouseEnter: () => setSpread(true), onMouseLeave: () => setSpread(false), style: { position: "relative", display: "flex", justifyContent: "center", minHeight: "500px" }, children: cards.map((card, i) => {
|
|
81
|
+
const baseMultiplier = 1.2;
|
|
82
|
+
const hoverMultiplier = spread ? 1.8 : baseMultiplier;
|
|
83
|
+
const isSelected = selectedCard === i;
|
|
84
|
+
let rotate, translateX, scale;
|
|
85
|
+
if (isSelected) {
|
|
86
|
+
rotate = "0deg";
|
|
87
|
+
translateX = "0px";
|
|
88
|
+
scale = 1.4;
|
|
89
|
+
}
|
|
90
|
+
else {
|
|
91
|
+
rotate = ((i - midIndex) * 10 * hoverMultiplier) + "deg";
|
|
92
|
+
translateX = ((i - midIndex) * 40 * hoverMultiplier) + "px";
|
|
93
|
+
scale = 1;
|
|
94
|
+
}
|
|
95
|
+
return (_jsx("div", { onClick: () => setSelectedCard(isSelected ? null : i), style: {
|
|
96
|
+
position: "absolute",
|
|
97
|
+
width: "280px",
|
|
98
|
+
transform: `rotate(${rotate}) translateX(${translateX}) scale(${scale})`,
|
|
99
|
+
transition: "all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1)",
|
|
100
|
+
zIndex: isSelected ? 30 : (i === midIndex ? 10 : 5),
|
|
101
|
+
cursor: "pointer",
|
|
102
|
+
opacity: isSelected ? 1 : (selectedCard !== null ? 0.3 : 1),
|
|
103
|
+
}, children: _jsxs("div", { style: {
|
|
104
|
+
backgroundColor: renderText(card.color) || surface,
|
|
105
|
+
border: `${isSelected ? 3 : 1}px solid ${isSelected ? accent : border}`,
|
|
106
|
+
borderRadius: theme.card?.radius ?? "var(--lx-productcard-radius, var(--lx-radius-xl))",
|
|
107
|
+
padding: "var(--lx-productcard-padding, var(--lx-space-lg))",
|
|
108
|
+
position: "relative",
|
|
109
|
+
boxShadow: isSelected ? `0 20px 60px ${accent}40` : undefined,
|
|
110
|
+
transition: "all 0.3s ease",
|
|
111
|
+
}, children: [card.badge && !isSelected && (_jsx("div", { style: {
|
|
112
|
+
position: "absolute",
|
|
113
|
+
top: "var(--lx-productcard-badge-offset, var(--lx-space-3))",
|
|
114
|
+
right: "var(--lx-productcard-badge-offset, var(--lx-space-3))",
|
|
115
|
+
backgroundColor: accent,
|
|
116
|
+
color: "#fff",
|
|
117
|
+
padding: "4px 10px",
|
|
118
|
+
borderRadius: "var(--lx-productcard-badge-radius, var(--lx-radius-full))",
|
|
119
|
+
fontSize: "0.75rem",
|
|
120
|
+
fontWeight: 600,
|
|
121
|
+
fontFamily: theme.fonts.body,
|
|
122
|
+
transition: "opacity 0.2s ease",
|
|
123
|
+
}, children: renderText(card.badge) })), card.icon && _jsx("div", { style: { fontSize: "1.5rem", marginBottom: "var(--lx-productcard-icon-gap, var(--lx-space-sm))" }, children: renderText(card.icon) }), _jsx("div", { "data-lx-field": "title", style: { fontFamily: theme.fonts.display, fontWeight: 700, color: textColor, fontSize: isSelected ? "1.3rem" : "1.1rem", transition: "font-size 0.3s ease", ...elStyle(elementStyles, "title") }, children: renderText(card.title) }), _jsx("div", { "data-lx-field": "body", style: {
|
|
124
|
+
fontFamily: theme.fonts.body,
|
|
125
|
+
color: textColor,
|
|
126
|
+
opacity: 0.7,
|
|
127
|
+
marginTop: "var(--lx-productcard-body-gap, var(--lx-space-sm))",
|
|
128
|
+
fontSize: "0.95rem",
|
|
129
|
+
maxHeight: isSelected ? "200px" : "0",
|
|
130
|
+
overflow: "hidden",
|
|
131
|
+
opacity: isSelected ? 1 : 0,
|
|
132
|
+
animation: isSelected ? "expandCard 0.4s ease forwards" : undefined,
|
|
133
|
+
...elStyle(elementStyles, "body"),
|
|
134
|
+
}, children: renderText(card.body) })] }) }, i));
|
|
135
|
+
}) })] }));
|
|
136
|
+
}
|
|
137
|
+
// fallback
|
|
138
|
+
return (_jsxs("section", { style: { backgroundColor: theme.palette.bg, padding: "48px 20px" }, children: [heading && _jsx("h2", { "data-lx-field": "heading", style: { fontFamily: theme.fonts.display, color: textColor, textAlign: "center", fontSize: "2rem", fontWeight: 700, marginBottom: "var(--lx-productcard-heading-gap, var(--lx-space-xl))", ...elStyle(elementStyles, "heading") }, children: heading }), _jsx("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lx-productcard-stack-gap, var(--lx-space-md))", maxWidth: "640px", margin: "0 auto" }, children: cards.map((card, i) => _jsx(CardEl, { card: card, style: {}, showFull: true }, i)) })] }));
|
|
139
|
+
}
|
|
140
|
+
//# sourceMappingURL=CardStack.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardStack.js","sourceRoot":"","sources":["../../src/cards/CardStack.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAWjD,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAkB;IAC1F,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IAC5C,MAAM,QAAQ,GAAI,OAAO,CAAC,KAAmB,IAAI,EAAE,CAAC;IACpD,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAe,CAAC;IAEjD,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC;IACpC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC;IACtC,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;IACrC,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,IAAI,SAAS,CAAC;IAEjD,SAAS,MAAM,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAqE;QAC1G,OAAO,CACL,eAAK,KAAK,EAAE;gBACV,eAAe,EAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,OAAO;gBAClD,MAAM,EAAE,aAAa,MAAM,EAAE;gBAC7B,YAAY,EAAE,KAAK,CAAC,IAAI,EAAE,MAAM,IAAI,mDAAmD;gBACvF,OAAO,EAAE,mDAAmD;gBAC5D,QAAQ,EAAE,UAAU;gBACpB,GAAG,KAAK;aACT,aACE,IAAI,CAAC,KAAK,IAAI,CACb,cAAK,KAAK,EAAE;wBACV,QAAQ,EAAE,UAAU;wBACpB,GAAG,EAAE,uDAAuD;wBAC5D,KAAK,EAAE,uDAAuD;wBAC9D,eAAe,EAAE,MAAM;wBACvB,KAAK,EAAE,MAAM;wBACb,OAAO,EAAE,UAAU;wBACnB,YAAY,EAAE,2DAA2D;wBACzE,QAAQ,EAAE,SAAS;wBACnB,UAAU,EAAE,GAAG;wBACf,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI;qBAC7B,YACE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GACnB,CACP,EACA,IAAI,CAAC,IAAI,IAAI,cAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,oDAAoD,EAAE,YAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,GAAO,EAClJ,IAAI,CAAC,SAAS,IAAI,QAAQ,IAAI,CAC7B,cAAK,GAAG,EAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,GAAG,EAAC,EAAE,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,KAAK,EAAE,MAAM,IAAI,qBAAqB,EAAE,YAAY,EAAE,oDAAoD,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,GAAI,CAC/O,EACD,+BAAmB,OAAO,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,EAAE,YAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAO,EAC/L,QAAQ,IAAI,+BAAmB,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,oDAAoD,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC,EAAE,YAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,GAAO,IAClQ,CACP,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,KAAK,gBAAgB,EAAE,CAAC;QACjC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC9C,MAAM,WAAW,GAAG;YAClB,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;YACpF,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE;YAC3E,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE;YAC3E,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE;SAC5E,CAAC;QAEF,OAAO,CACL,mBAAS,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,EAAE,yHAAyH,EAAE,aACtL,OAAO,IAAI,8BAAkB,SAAS,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,uDAAuD,EAAE,GAAG,OAAO,CAAC,aAAa,EAAE,SAAS,CAAC,EAAE,YAAG,OAAO,GAAM,EACzR,cACE,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EACpC,YAAY,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,EACrC,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,YAEpF,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;wBACrB,MAAM,GAAG,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC;wBAC3B,IAAI,CAAC,GAAG;4BAAE,OAAO,IAAI,CAAC;wBACtB,OAAO,CACL,cAAa,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,cAAc,GAAG,CAAC,UAAU,cAAc,GAAG,CAAC,MAAM,GAAG,EAAE,OAAO,EAAE,GAAG,CAAC,OAAO,EAAE,UAAU,EAAE,wCAAwC,EAAE,YAC7N,KAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,CAAC,QAAQ,GAAI,IADjD,CAAC,CAEL,CACP,CAAC;oBACJ,CAAC,CAAC,GACE,IACE,CACX,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,KAAK,kBAAkB,EAAE,CAAC;QACnC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAc,IAAI,GAAG,EAAE,CAAC,CAAC;QACrE,MAAM,QAAQ,GAAG,MAAM,CAA4B,EAAE,CAAC,CAAC;QAEvD,SAAS,CAAC,GAAG,EAAE;YACb,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,OAAO,EAAE,EAAE;gBACV,OAAO,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;oBACxB,MAAM,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,MAAwB,CAAC,CAAC;oBACrE,IAAI,KAAK,CAAC,cAAc,IAAI,GAAG,KAAK,CAAC,CAAC,EAAE,CAAC;wBACvC,aAAa,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;oBACnD,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,EACD,EAAE,SAAS,EAAE,GAAG,EAAE,CACnB,CAAC;YACF,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,IAAI,EAAE;gBAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACpE,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;QACrC,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,OAAO,CACL,mBAAS,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,EAAE,yHAAyH,EAAE,aACtL,OAAO,IAAI,8BAAkB,SAAS,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,uDAAuD,EAAE,GAAG,OAAO,CAAC,aAAa,EAAE,SAAS,CAAC,EAAE,YAAG,OAAO,GAAM,EACzR,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,oDAAoD,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,YACrJ,CAAC,OAAO,CAAC,KAAkB,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACnD,cAEE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,EAC1C,KAAK,EAAE;4BACL,OAAO,EAAE,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;4BAClC,SAAS,EAAE,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB;4BACnE,UAAU,EAAE,iBAAiB,CAAC,GAAG,IAAI,GAAG;yBACzC,YAED,KAAC,MAAM,IAAC,IAAI,EAAE,IAAgB,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,IAAI,GAAI,IARxD,CAAC,CASF,CACP,CAAC,GACE,IACE,CACX,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC1B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC5C,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;QACtE,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAE9C,OAAO,CACL,mBAAS,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,EAAE,yHAAyH,EAAE,aACvL,0BAAQ;;;;;SAKP,GAAS,EACT,OAAO,IAAI,8BAAkB,SAAS,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,uDAAuD,EAAE,GAAG,OAAO,CAAC,aAAa,EAAE,SAAS,CAAC,EAAE,YAAG,OAAO,GAAM,EAEzR,cACE,YAAY,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EACnC,YAAY,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,EACpC,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,YAE7F,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;wBACrB,MAAM,cAAc,GAAG,GAAG,CAAC;wBAC3B,MAAM,eAAe,GAAG,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,cAAc,CAAC;wBACtD,MAAM,UAAU,GAAG,YAAY,KAAK,CAAC,CAAC;wBAEtC,IAAI,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC;wBAC9B,IAAI,UAAU,EAAE,CAAC;4BACf,MAAM,GAAG,MAAM,CAAC;4BAChB,UAAU,GAAG,KAAK,CAAC;4BACnB,KAAK,GAAG,GAAG,CAAC;wBACd,CAAC;6BAAM,CAAC;4BACN,MAAM,GAAG,CAAC,CAAC,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,GAAG,eAAe,CAAC,GAAG,KAAK,CAAC;4BACzD,UAAU,GAAG,CAAC,CAAC,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,GAAG,eAAe,CAAC,GAAG,IAAI,CAAC;4BAC5D,KAAK,GAAG,CAAC,CAAC;wBACZ,CAAC;wBAED,OAAO,CACL,cAEE,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EACrD,KAAK,EAAE;gCACL,QAAQ,EAAE,UAAU;gCACpB,KAAK,EAAE,OAAO;gCACd,SAAS,EAAE,UAAU,MAAM,gBAAgB,UAAU,WAAW,KAAK,GAAG;gCACxE,UAAU,EAAE,4CAA4C;gCACxD,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;gCACnD,MAAM,EAAE,SAAS;gCACjB,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;6BAC5D,YAED,eAAK,KAAK,EAAE;oCACV,eAAe,EAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,OAAO;oCAClD,MAAM,EAAE,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,EAAE;oCACvE,YAAY,EAAE,KAAK,CAAC,IAAI,EAAE,MAAM,IAAI,mDAAmD;oCACvF,OAAO,EAAE,mDAAmD;oCAC5D,QAAQ,EAAE,UAAU;oCACpB,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,eAAe,MAAM,IAAI,CAAC,CAAC,CAAC,SAAS;oCAC7D,UAAU,EAAE,eAAe;iCAC5B,aACE,IAAI,CAAC,KAAK,IAAI,CAAC,UAAU,IAAI,CAC5B,cAAK,KAAK,EAAE;4CACV,QAAQ,EAAE,UAAU;4CACpB,GAAG,EAAE,uDAAuD;4CAC5D,KAAK,EAAE,uDAAuD;4CAC9D,eAAe,EAAE,MAAM;4CACvB,KAAK,EAAE,MAAM;4CACb,OAAO,EAAE,UAAU;4CACnB,YAAY,EAAE,2DAA2D;4CACzE,QAAQ,EAAE,SAAS;4CACnB,UAAU,EAAE,GAAG;4CACf,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI;4CAC5B,UAAU,EAAE,mBAAmB;yCAChC,YACE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GACnB,CACP,EACA,IAAI,CAAC,IAAI,IAAI,cAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,oDAAoD,EAAE,YAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,GAAO,EACnJ,+BAAmB,OAAO,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,EAAE,UAAU,EAAE,qBAAqB,EAAE,GAAG,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,EAAE,YACxN,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GACnB,EACN,+BAAmB,MAAM,EAAC,KAAK,EAAE;4CAC/B,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI;4CAC5B,KAAK,EAAE,SAAS;4CAChB,OAAO,EAAE,GAAG;4CACZ,SAAS,EAAE,oDAAoD;4CAC/D,QAAQ,EAAE,SAAS;4CACnB,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;4CACrC,QAAQ,EAAE,QAAQ;4CAClB,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;4CAC3B,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,+BAA+B,CAAC,CAAC,CAAC,SAAS;4CACnE,GAAG,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC;yCAClC,YACE,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,GAClB,IACF,IAxDD,CAAC,CAyDF,CACP,CAAC;oBACJ,CAAC,CAAC,GACE,IACE,CACX,CAAC;IACJ,CAAC;IAED,WAAW;IACX,OAAO,CACL,mBAAS,KAAK,EAAE,EAAE,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,aACxE,OAAO,IAAI,8BAAkB,SAAS,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,YAAY,EAAE,uDAAuD,EAAE,GAAG,OAAO,CAAC,aAAa,EAAE,SAAS,CAAC,EAAE,YAAG,OAAO,GAAM,EACzR,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,qDAAqD,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,YACtJ,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,KAAC,MAAM,IAAS,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,IAAI,IAAxC,CAAC,CAA2C,CAAC,GAC9E,IACE,CACX,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FeatureCard.d.ts","sourceRoot":"","sources":["../../src/cards/FeatureCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAoR/C,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,cAAc,2CAmD7F"}
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { renderText } from "../renderText";
|
|
3
|
+
import { elStyle } from "../utils/elementStyles";
|
|
4
|
+
import { AspectBox } from "../primitives/AspectBox";
|
|
5
|
+
import { MediaLoop } from "../primitives/MediaLoop";
|
|
6
|
+
import { MediaFlip } from "../primitives/MediaFlip";
|
|
7
|
+
import { TiltCard } from "../primitives/TiltCard";
|
|
8
|
+
import { CursorSpotlight } from "../primitives/CursorSpotlight";
|
|
9
|
+
// ── Shared caption bar ─────────────────────────────────────────────────────────
|
|
10
|
+
function CaptionBar({ label, tag, textColor, accentColor, borderColor, fontFamily, elementStyles, }) {
|
|
11
|
+
return (_jsxs("div", { className: "flex items-center justify-between px-3 py-2 shrink-0", style: { borderTop: `1px solid ${borderColor}`, backgroundColor: "transparent" }, children: [_jsx("span", { "data-lx-field": "label", className: "text-xs font-medium truncate", style: { color: textColor, fontFamily, ...elStyle(elementStyles, "label") }, children: label }), tag && (_jsx("span", { "data-lx-field": "tag", className: "ml-2 shrink-0 text-[9px] font-bold tracking-widest uppercase px-1.5 py-0.5 border", style: { color: accentColor, borderColor: accentColor, ...elStyle(elementStyles, "tag") }, children: tag }))] }));
|
|
12
|
+
}
|
|
13
|
+
// ── Editorial variant ─────────────────────────────────────────────────────────
|
|
14
|
+
function EditorialCard({ imageUrl, headline, headlineStrike, label, tag, tiltDegree, theme, elementStyles, }) {
|
|
15
|
+
const textColor = theme.palette.text;
|
|
16
|
+
const borderColor = theme.palette.border || `${textColor}22`;
|
|
17
|
+
const accentColor = theme.palette.accent;
|
|
18
|
+
const fontDisplay = `${theme.fonts.display}, serif`;
|
|
19
|
+
const fontBody = `${theme.fonts.body}, sans-serif`;
|
|
20
|
+
const bg = "#f9f7f3";
|
|
21
|
+
// Build headline with optional strikethrough word
|
|
22
|
+
let headlineEl = headline;
|
|
23
|
+
if (headlineStrike && headline.includes(headlineStrike)) {
|
|
24
|
+
const parts = headline.split(headlineStrike);
|
|
25
|
+
headlineEl = (_jsxs(_Fragment, { children: [parts[0], _jsx("del", { style: { textDecorationColor: accentColor, textDecorationThickness: "3px" }, children: headlineStrike }), parts[1]] }));
|
|
26
|
+
}
|
|
27
|
+
return (_jsxs("div", { className: "flex flex-col overflow-hidden", style: {
|
|
28
|
+
backgroundColor: bg,
|
|
29
|
+
// Double crop-mark border: outer solid line + inner inset
|
|
30
|
+
outline: `1px solid ${textColor}`,
|
|
31
|
+
outlineOffset: "-1px",
|
|
32
|
+
boxShadow: `inset 0 0 0 7px ${bg}, inset 0 0 0 9px ${textColor}55`,
|
|
33
|
+
fontFamily: fontBody,
|
|
34
|
+
position: "relative",
|
|
35
|
+
}, children: [_jsx("div", { className: "px-4 pt-5 pb-3", children: _jsx("h3", { "data-lx-field": "headline", style: {
|
|
36
|
+
fontSize: "clamp(1.6rem, 3.5vw, 2.4rem)",
|
|
37
|
+
fontWeight: 900,
|
|
38
|
+
lineHeight: 1.05,
|
|
39
|
+
letterSpacing: "-0.02em",
|
|
40
|
+
color: textColor,
|
|
41
|
+
fontFamily: fontDisplay,
|
|
42
|
+
textTransform: "uppercase",
|
|
43
|
+
...elStyle(elementStyles, "headline"),
|
|
44
|
+
}, children: headlineEl }) }), _jsx("div", { className: "flex items-center justify-center px-6 py-4 flex-1", children: _jsx("div", { style: {
|
|
45
|
+
transform: `rotate(${tiltDegree}deg)`,
|
|
46
|
+
filter: "drop-shadow(0 8px 24px rgba(0,0,0,0.15))",
|
|
47
|
+
width: "70%",
|
|
48
|
+
}, children: _jsx(AspectBox, { aspect: "3:4", children: _jsx(MediaLoop, { src: imageUrl, alt: label, fit: "contain" }) }) }) }), _jsx(CaptionBar, { label: label, tag: tag, textColor: textColor, accentColor: accentColor, borderColor: `${textColor}22`, fontFamily: fontBody, elementStyles: elementStyles })] }));
|
|
49
|
+
}
|
|
50
|
+
// ── Tilt variant ──────────────────────────────────────────────────────────────
|
|
51
|
+
function TiltVariant({ imageUrl, label, price, comparePrice, ctaText, ctaUrl, bgColor, theme, elementStyles, }) {
|
|
52
|
+
const textColor = "#f5f5f0";
|
|
53
|
+
const fontBody = `${theme.fonts.body}, sans-serif`;
|
|
54
|
+
return (_jsxs("div", { className: "flex flex-col overflow-hidden", style: { backgroundColor: bgColor, fontFamily: fontBody }, children: [_jsx(TiltCard, { maxTilt: 8, glare: true, className: "flex-1", children: _jsx(AspectBox, { aspect: "3:4", children: _jsx(MediaLoop, { src: imageUrl, alt: label, fit: "contain" }) }) }), _jsxs("div", { className: "px-4 py-3", style: { backgroundColor: bgColor }, children: [_jsx("p", { "data-lx-field": "label", className: "text-sm font-semibold truncate", style: { color: textColor, ...elStyle(elementStyles, "label") }, children: label }), price && (_jsxs("div", { className: "flex items-center gap-2 mt-0.5", children: [_jsx("span", { "data-lx-field": "price", className: "text-base font-bold", style: { color: textColor, ...elStyle(elementStyles, "price") }, children: price }), comparePrice && (_jsx("span", { "data-lx-field": "compare_price", className: "text-xs line-through opacity-50", style: { color: textColor, ...elStyle(elementStyles, "compare_price") }, children: comparePrice }))] })), ctaText && (_jsx("a", { "data-lx-field": "cta_text", href: ctaUrl, className: "inline-block mt-3 px-4 py-1.5 text-xs font-semibold rounded-full", style: { backgroundColor: theme.palette.accent, color: "#fff", ...elStyle(elementStyles, "cta_text") }, children: ctaText }))] })] }));
|
|
55
|
+
}
|
|
56
|
+
// ── Spotlight variant ─────────────────────────────────────────────────────────
|
|
57
|
+
function SpotlightVariant({ imageUrl, label, ctaText, ctaUrl, bgColor, theme, elementStyles, }) {
|
|
58
|
+
const fontBody = `${theme.fonts.body}, sans-serif`;
|
|
59
|
+
return (_jsxs("div", { className: "flex flex-col overflow-hidden", style: { backgroundColor: bgColor, fontFamily: fontBody }, children: [_jsx(CursorSpotlight, { radius: 160, color: "rgba(255,180,80,0.28)", className: "flex-1", children: _jsx(AspectBox, { aspect: "3:4", children: _jsx(MediaLoop, { src: imageUrl, alt: label, fit: "contain" }) }) }), _jsxs("div", { className: "px-4 py-3", style: { backgroundColor: bgColor }, children: [_jsx("p", { "data-lx-field": "label", className: "text-xs font-semibold tracking-widest uppercase", style: { color: "#f5f5f0", ...elStyle(elementStyles, "label") }, children: label }), ctaText && (_jsx("a", { "data-lx-field": "cta_text", href: ctaUrl, className: "inline-block mt-3 px-4 py-1.5 text-xs font-semibold rounded-full", style: { backgroundColor: theme.palette.accent, color: "#fff", ...elStyle(elementStyles, "cta_text") }, children: ctaText }))] })] }));
|
|
60
|
+
}
|
|
61
|
+
// ── Desaturate variant ────────────────────────────────────────────────────────
|
|
62
|
+
function DesaturateVariant({ imageUrl, hoverImage, label, statusBadge, theme, elementStyles, }) {
|
|
63
|
+
const textColor = theme.palette.text;
|
|
64
|
+
const accentColor = theme.palette.accent;
|
|
65
|
+
const borderColor = theme.palette.border || `${textColor}18`;
|
|
66
|
+
const fontBody = `${theme.fonts.body}, sans-serif`;
|
|
67
|
+
return (_jsxs("div", { className: "flex flex-col overflow-hidden", style: {
|
|
68
|
+
backgroundColor: theme.palette.bg,
|
|
69
|
+
border: `1px solid ${borderColor}`,
|
|
70
|
+
fontFamily: fontBody,
|
|
71
|
+
}, children: [_jsxs("div", { className: "relative flex-1", children: [_jsx(MediaFlip, { front: imageUrl, back: hoverImage, hoverEffect: "desaturate", aspect: "3:4", fit: "contain" }), _jsx("span", { className: "absolute bottom-2 right-2 text-[9px] italic pointer-events-none hidden sm:block", style: { color: `${textColor}55` }, children: "hover to reveal" })] }), _jsx(CaptionBar, { label: label, tag: statusBadge, textColor: textColor, accentColor: accentColor, borderColor: borderColor, fontFamily: fontBody, elementStyles: elementStyles })] }));
|
|
72
|
+
}
|
|
73
|
+
// ── Main export ───────────────────────────────────────────────────────────────
|
|
74
|
+
export default function ProductCard({ content, variant, theme, elementStyles }) {
|
|
75
|
+
const imageUrl = content.image_url ? renderText(content.image_url) : "";
|
|
76
|
+
const hoverImage = content.hover_image ? renderText(content.hover_image) : undefined;
|
|
77
|
+
const headline = content.headline ? renderText(content.headline) : "Product";
|
|
78
|
+
const headlineStrike = content.headline_strike ? renderText(content.headline_strike) : undefined;
|
|
79
|
+
const label = content.label ? renderText(content.label) : "";
|
|
80
|
+
const tag = content.tag ? renderText(content.tag) : undefined;
|
|
81
|
+
const price = content.price ? renderText(content.price) : undefined;
|
|
82
|
+
const comparePrice = content.compare_price ? renderText(content.compare_price) : undefined;
|
|
83
|
+
const ctaText = content.cta_text ? renderText(content.cta_text) : undefined;
|
|
84
|
+
const ctaUrl = content.cta_url ? renderText(content.cta_url) : "#";
|
|
85
|
+
const statusBadge = content.status_badge ? renderText(content.status_badge) : undefined;
|
|
86
|
+
const bgColor = content.bg_color ? String(content.bg_color) : "#111111";
|
|
87
|
+
const tiltDegree = typeof content.tilt_degree === "number" ? content.tilt_degree : 4;
|
|
88
|
+
if (variant === "tilt") {
|
|
89
|
+
return (_jsx(TiltVariant, { imageUrl: imageUrl, label: label, price: price, comparePrice: comparePrice, ctaText: ctaText, ctaUrl: ctaUrl, bgColor: bgColor, theme: theme, elementStyles: elementStyles }));
|
|
90
|
+
}
|
|
91
|
+
if (variant === "spotlight") {
|
|
92
|
+
return (_jsx(SpotlightVariant, { imageUrl: imageUrl, label: label, ctaText: ctaText, ctaUrl: ctaUrl, bgColor: bgColor, theme: theme, elementStyles: elementStyles }));
|
|
93
|
+
}
|
|
94
|
+
if (variant === "desaturate") {
|
|
95
|
+
return (_jsx(DesaturateVariant, { imageUrl: imageUrl, hoverImage: hoverImage, label: label, statusBadge: statusBadge, theme: theme, elementStyles: elementStyles }));
|
|
96
|
+
}
|
|
97
|
+
// Default: editorial
|
|
98
|
+
return (_jsx(EditorialCard, { imageUrl: imageUrl, headline: headline, headlineStrike: headlineStrike, label: label, tag: tag, tiltDegree: tiltDegree, theme: theme, elementStyles: elementStyles }));
|
|
99
|
+
}
|
|
100
|
+
//# sourceMappingURL=FeatureCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FeatureCard.js","sourceRoot":"","sources":["../../src/cards/FeatureCard.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FeaturedCard.d.ts","sourceRoot":"","sources":["../../src/cards/FeaturedCard.tsx"],"names":[],"mappings":"AAAyC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAMxF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,cAAc,2CAoM9F"}
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useRef, useState } from "react";
|
|
3
|
+
import { renderText } from "../renderText";
|
|
4
|
+
import { renderIcon } from "../utils/renderIcon";
|
|
5
|
+
import { TiltCard } from "../primitives/TiltCard";
|
|
6
|
+
import { elStyle } from "../utils/elementStyles";
|
|
7
|
+
export default function FeaturedCard({ content, variant, theme, elementStyles }) {
|
|
8
|
+
const title = renderText(content.title);
|
|
9
|
+
const body = renderText(content.body);
|
|
10
|
+
const imageUrl = content.image_url ? renderText(content.image_url) : undefined;
|
|
11
|
+
const icon = content.icon ? renderText(content.icon) : undefined;
|
|
12
|
+
const ctaText = content.cta_text ? renderText(content.cta_text) : undefined;
|
|
13
|
+
const ctaUrl = content.cta_url ? renderText(content.cta_url) : "#";
|
|
14
|
+
const badge = content.badge ? renderText(content.badge) : undefined;
|
|
15
|
+
const cardRef = useRef(null);
|
|
16
|
+
const [hovered, setHovered] = useState(false);
|
|
17
|
+
const [expanded, setExpanded] = useState(false);
|
|
18
|
+
const borderColor = theme.palette.border || `${theme.palette.text}18`;
|
|
19
|
+
const surfaceColor = theme.palette.surface || theme.palette.bg;
|
|
20
|
+
const textColor = theme.palette.text;
|
|
21
|
+
const imageBlock = imageUrl ? (_jsx("img", { src: imageUrl, alt: title, className: "w-full h-44 object-cover mb-4", style: { borderRadius: "var(--lx-card-radius)" }, draggable: false })) : null;
|
|
22
|
+
const badgeEl = badge ? (_jsx("span", { "data-lx-field": "badge", className: "inline-block px-2.5 py-0.5 text-xs font-semibold rounded-full mb-3", style: { backgroundColor: `${theme.palette.accent}20`, color: theme.palette.accent, ...elStyle(elementStyles, "badge") }, children: badge })) : null;
|
|
23
|
+
const iconEl = icon ? (_jsx("div", { className: "w-10 h-10 flex items-center justify-center rounded-xl mb-3", style: { backgroundColor: `${theme.palette.accent}15`, color: theme.palette.accent }, children: renderIcon(icon, { size: 24, color: theme.palette.accent }) })) : null;
|
|
24
|
+
const ctaEl = ctaText ? (_jsx("a", { href: ctaUrl, "data-lx-field": "cta_text", className: "inline-block mt-4 px-6 py-3 text-sm font-semibold text-white rounded-full hover:-translate-y-0.5 transition-transform", style: { backgroundColor: theme.palette.accent, ...elStyle(elementStyles, "cta_text") }, children: ctaText })) : null;
|
|
25
|
+
const baseCardStyle = {
|
|
26
|
+
backgroundColor: surfaceColor,
|
|
27
|
+
border: `1px solid ${borderColor}`,
|
|
28
|
+
color: textColor,
|
|
29
|
+
fontFamily: `${theme.fonts.body}, sans-serif`,
|
|
30
|
+
willChange: "transform",
|
|
31
|
+
};
|
|
32
|
+
if (variant === "expandable") {
|
|
33
|
+
return (_jsxs("div", { ref: cardRef, className: "rounded-2xl border p-6 cursor-pointer", style: {
|
|
34
|
+
...baseCardStyle,
|
|
35
|
+
overflow: "hidden",
|
|
36
|
+
transition: "box-shadow 0.3s ease",
|
|
37
|
+
boxShadow: hovered ? `var(--lx-shadow-md, 0 4px 20px rgba(0,0,0,0.1))` : "none",
|
|
38
|
+
}, onClick: () => setExpanded((v) => !v), onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: [_jsx("style", { children: `
|
|
39
|
+
.lx-expand-body {
|
|
40
|
+
overflow: hidden;
|
|
41
|
+
transition: max-height 0.4s ease, opacity 0.3s ease;
|
|
42
|
+
}
|
|
43
|
+
` }), _jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [icon && (_jsx("span", { style: { color: theme.palette.accent }, children: renderIcon(icon, { size: 20, color: theme.palette.accent }) })), _jsx("h3", { "data-lx-field": "title", className: "text-base font-semibold", style: { color: textColor, fontFamily: `${theme.fonts.display}, serif`, ...elStyle(elementStyles, "title") }, children: title })] }), _jsx("span", { className: "text-lg leading-none opacity-50 transition-transform", style: { transform: expanded ? "rotate(180deg)" : "rotate(0deg)", transition: "transform 0.3s ease" }, children: "\u25BE" })] }), _jsx("div", { className: "lx-expand-body", style: { maxHeight: expanded ? "600px" : "0px", opacity: expanded ? 1 : 0 }, children: _jsxs("div", { className: "pt-4", children: [imageBlock, badgeEl, _jsx("p", { "data-lx-field": "body", className: "text-sm leading-relaxed opacity-80", style: { ...elStyle(elementStyles, "body") }, children: body }), ctaEl] }) })] }));
|
|
44
|
+
}
|
|
45
|
+
if (variant === "glow") {
|
|
46
|
+
return (_jsxs("div", { ref: cardRef, className: "rounded-2xl border p-6", style: {
|
|
47
|
+
...baseCardStyle,
|
|
48
|
+
transition: `box-shadow 0.35s ease, transform 0.2s ease`,
|
|
49
|
+
boxShadow: hovered
|
|
50
|
+
? `0 0 40px ${theme.palette.accent}40, 0 0 80px ${theme.palette.accent}18`
|
|
51
|
+
: `0 1px 6px rgba(0,0,0,0.06)`,
|
|
52
|
+
transform: hovered ? "translateY(-3px)" : "translateY(0)",
|
|
53
|
+
}, onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: [imageBlock, badgeEl, iconEl, _jsx("h3", { "data-lx-field": "title", className: "text-lg font-semibold mb-2", style: { color: textColor, fontFamily: `${theme.fonts.display}, serif`, ...elStyle(elementStyles, "title") }, children: title }), _jsx("p", { "data-lx-field": "body", className: "text-sm leading-relaxed opacity-75", style: { ...elStyle(elementStyles, "body") }, children: body }), ctaEl] }));
|
|
54
|
+
}
|
|
55
|
+
// 3d_tilt (default) and glare share the same tilt logic
|
|
56
|
+
const is3dOrGlare = variant === "3d_tilt" || variant === "glare" || !variant;
|
|
57
|
+
if (is3dOrGlare) {
|
|
58
|
+
return (_jsxs(TiltCard, { maxTilt: 10, glare: variant === "glare", perspective: 1000, className: "rounded-2xl border p-6", style: {
|
|
59
|
+
...baseCardStyle,
|
|
60
|
+
boxShadow: `0 1px 6px rgba(0,0,0,0.06)`,
|
|
61
|
+
}, children: [imageBlock, badgeEl, iconEl, _jsx("h3", { "data-lx-field": "title", className: "text-lg font-semibold mb-2 relative z-10", style: { color: textColor, fontFamily: `${theme.fonts.display}, serif`, ...elStyle(elementStyles, "title") }, children: title }), _jsx("p", { "data-lx-field": "body", className: "text-sm leading-relaxed opacity-75 relative z-10", style: { ...elStyle(elementStyles, "body") }, children: body }), ctaEl && _jsx("div", { className: "relative z-10", children: ctaEl })] }));
|
|
62
|
+
}
|
|
63
|
+
// Fallback
|
|
64
|
+
return (_jsxs("div", { className: "rounded-2xl border p-6", style: baseCardStyle, children: [imageBlock, badgeEl, iconEl, _jsx("h3", { "data-lx-field": "title", className: "text-lg font-semibold mb-2", style: { color: textColor, fontFamily: `${theme.fonts.display}, serif`, ...elStyle(elementStyles, "title") }, children: title }), _jsx("p", { "data-lx-field": "body", className: "text-sm leading-relaxed opacity-75", style: { ...elStyle(elementStyles, "body") }, children: body }), ctaEl] }));
|
|
65
|
+
}
|
|
66
|
+
//# sourceMappingURL=FeaturedCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FeaturedCard.js","sourceRoot":"","sources":["../../src/cards/FeaturedCard.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TerminalCard.d.ts","sourceRoot":"","sources":["../../src/cards/TerminalCard.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAG/C,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,cAAc,2CAwI/E"}
|