UNPKG

@coinmeca/ui

Version:

This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).

21 lines 1.27 kB
"use client"; import { motion } from "motion/react"; import { useSwipe } from "../../../../hooks"; import Style from "./SlideContainer.styled"; import SlideContent from "./SlideContent"; export default function SlideContainer(props) { const vertical = props?.vertical || false; const offset = typeof props?.offset === "number" ? props?.offset : 15; const unit = typeof props?.unit === "string" ? props?.unit : "%"; const swipe = useSwipe(props?.swipe && { ...(typeof props?.swipe === "object" && props?.swipe), length: props?.contents?.length }); return (<Style as={motion.div} $vertical={vertical} style={props?.style}> {props?.contents && props?.contents?.length > 0 ? ( // <AnimatePresence initial={false} custom={swipe?.direction}> props?.contents.map((content, i) => (<SlideContent key={i} vertical={vertical} offset={offset} unit={unit} active={swipe ? swipe?.index === i : content.active} swipe={swipe && { ...swipe, variants: swipe?.variants(i) }} style={content?.style}> {content.children} </SlideContent>))) : ( /* </AnimatePresence> */ <SlideContent>There is no content.</SlideContent>)} </Style>); } //# sourceMappingURL=SlideContainer.jsx.map