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).

71 lines 3.21 kB
"use client"; import { motion } from "motion/react"; import * as Texts from "./Text.styled"; export default function Text(props) { const type = props?.type === "button" || props?.type === "link" ? props?.type : props?.href ? "link" : props?.onClick ? "button" : props?.type; const size = props?.size || 1.5; const weight = props?.weight || "bold"; const height = props?.height || 1.5; const color = props?.color || "white"; const opacity = typeof props?.opacity === "number" && props?.opacity > 1 ? 1 : props?.opacity || 1; const textProps = { ...(props?.motion && { ...props?.motion, as: motion?.[type === "link" ? "a" : type === "desc" ? "span" : type || "span"], }), title: props?.title, style: props?.style, $color: color, $opacity: opacity, $weight: weight, $height: height, $change: props?.change, $align: props?.align, $case: props?.case, $fit: props?.fit, $fix: props?.fix, }; switch (type) { case "h1": return <Texts.H1 {...textProps}>{props?.children}</Texts.H1>; case "h2": return <Texts.H2 {...textProps}>{props?.children}</Texts.H2>; case "h3": return <Texts.H3 {...textProps}>{props?.children}</Texts.H3>; case "h4": return <Texts.H4 {...textProps}>{props?.children}</Texts.H4>; case "h5": return <Texts.H5 {...textProps}>{props?.children}</Texts.H5>; case "h6": return <Texts.H6 {...textProps}>{props?.children}</Texts.H6>; case "strong": return <Texts.Strong {...textProps}>{props?.children}</Texts.Strong>; case "p": return (<Texts.P {...textProps} $weight={props?.weight || "normal"}> {props?.children} </Texts.P>); case "desc": return (<Texts.Desc {...textProps} $weight={props?.weight || "normal"} $opacity={(typeof props?.opacity === "number" && props?.opacity > 1 ? 1 : props?.opacity) || undefined}> {props?.children} </Texts.Desc>); case "link": return (<Texts.Link {...textProps} href={props?.href} target={!props?.target && !props?.target?.startsWith("/") ? "_blank" : props?.target} onClick={(e) => typeof props?.onClick === "function" && props?.onClick(e)} $size={size} $responsive={props?.responsive}> {props?.children} </Texts.Link>); case "button": return (<Texts.Button {...textProps} href={props?.href} target={!props?.target && !props?.target?.startsWith("/") ? "_blank" : props?.target} onClick={(e) => typeof props?.onClick === "function" && props?.onClick(e)} $size={size} $responsive={props?.responsive}> {props?.children} </Texts.Button>); default: return (<Texts.Text {...textProps} $size={size} $responsive={props?.responsive}> {props?.children} </Texts.Text>); } } //# sourceMappingURL=Text.jsx.map