@mysetup/typography

Typography component and shared styles for React applications.

Installation

pnpm add @mysetup/typography react react-dom

Supported libraries and runtimes

| Supported | Notes | | ------------------------- | ------------------------ | | React | Required peer dependency | | Vite React apps | Supported | | Next.js client components | Supported | | Next.js server components | Not supported | | Node.js scripts | Not supported |

Usage

"use client";

import { Typography } from "@mysetup/typography";
import "@mysetup/typography/styles.css";

export function HeroTitle() {
    return (
        <Typography as="h1" variant="headline2" display>
            Design System Title
        </Typography>
    );
}

Styles

• Import @mysetup/typography/styles.css once in your app entrypoint, layout, or component tree.
• The package also keeps @mysetup/typography/style.css as a compatibility alias.

Props

• as: HTML tag or React component to render
• variant: typography variant name
• display: toggles the display font modifier
• className: additional classes merged with the generated variant class