"use client";
import { AnimatePresence } from "motion/react";
import Text from "./Text";
import { Row } from "../../layouts";
export default function TextMotion(props) {
    const letters = props?.children
        ? Array.isArray(props?.children)
            ? props?.children
            : props?.children === ""
                ? []
                : props?.children?.toString()?.split("")
        : [];
    return (<AnimatePresence mode={props?.motion?.mode || "sync"}>
            <Row gap={props?.motion?.gap || 0} layout="size" fit={typeof props?.motion?.fit === "boolean" ? props?.motion?.fit : true} fix={typeof props?.motion?.fix === "boolean" ? props?.motion?.fix : true}>
                {letters?.length &&
            letters?.map((letter, i) => (<Text key={i} {...props} motion={{
                    ...props?.motion,
                    layoutId: `${i}`,
                    layout: props?.motion?.layout || "position",
                }}>
                            {letter === " " ? "\u00A0" : letter}
                        </Text>))}
            </Row>
        </AnimatePresence>);
}
//# sourceMappingURL=TextMotion.jsx.map