/** * @usevyre/react — Typography * * AI CONTEXT: * ┌──────────────────────────────────────────────────────────────┐ * │ Components: Text · Heading · Code · Blockquote · Lead │ * │ Import: import { Text, Heading, ... } from "@usevyre/react" │ * │ │ * │ Text props: │ * │ as = "p"(default)|"span"|"div"|"label"|"li"|"dt"|"dd"│ * │ size = "xs"|"sm"|"md"(default)|"lg"|"xl" │ * │ weight = "normal"|"medium"|"semibold"|"bold" │ * │ color = "default"|"muted"|"accent"|"danger"|"success" │ * │ truncate = boolean │ * │ mono = boolean │ * │ │ * │ Heading props: │ * │ as = "h1"|"h2"(default)|"h3"|"h4"|"h5"|"h6" │ * │ size = "xs"|"sm"|"md"(default)|"lg"|"xl"|"2xl"|"3xl" │ * │ weight = "normal"|"medium"|"semibold"|"bold"(default) │ * │ │ * │ Code props: │ * │ block = boolean (renders as
block) │
* └──────────────────────────────────────────────────────────────┘
*
* @example
* Page title
* Supporting description.
* Introductory paragraph with larger text.
* npm install @usevyre/react
* A meaningful quote.
*/
import React from "react";
type TextAs = "p" | "span" | "div" | "label" | "li" | "dt" | "dd";
type TextSize = "xs" | "sm" | "md" | "lg" | "xl";
type TextWeight = "normal" | "medium" | "semibold" | "bold";
type TextColor = "default" | "muted" | "accent" | "danger" | "success" | "warning";
export interface TextProps extends React.HTMLAttributes {
as?: TextAs;
size?: TextSize;
weight?: TextWeight;
color?: TextColor;
truncate?: boolean;
mono?: boolean;
}
export declare const Text: React.ForwardRefExoticComponent>;
type HeadingAs = "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
type HeadingSize = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
export interface HeadingProps extends React.HTMLAttributes {
as?: HeadingAs;
size?: HeadingSize;
weight?: TextWeight;
color?: TextColor;
truncate?: boolean;
}
export declare const Heading: React.ForwardRefExoticComponent>;
export interface LeadProps extends React.HTMLAttributes {
}
export declare const Lead: React.ForwardRefExoticComponent>;
export interface CodeProps extends React.HTMLAttributes {
block?: boolean;
}
export declare const Code: React.ForwardRefExoticComponent>;
export interface BlockquoteProps extends React.BlockquoteHTMLAttributes {
}
export declare const Blockquote: React.ForwardRefExoticComponent>;
export {};