@activecollab/components/dist/esm/components/Typography/Typography.d.ts

ActiveCollab Components

import React, { HTMLAttributes, ReactNode } from "react";
import { PolymorphicComponentPropsWithRef } from "../../utils/types";
export type Variant = "Title 1" | "Title 2" | "Header 2" | "Header 3" | "Body 1" | "Body 2" | "Caption 1" | "Caption 2";
export interface ITypographyProps extends HTMLAttributes<HTMLElement> {
    /** Font color. */
    color?: "primary" | "secondary" | "tertiary" | "quaternary" | "theme-primary" | "theme-secondary" | "only-white" | "only-black" | "page-paper" | "success" | "alert" | "warning";
    /** Tabular numbers. */
    tabularNums?: boolean;
    /** Italic font style. */
    italic?: boolean;
    /** Font letter spacing. */
    letterSpacing?: "tight" | "regular" | "wide";
    /** Font line height. */
    lineHeight?: "tight" | "regular" | "loose";
    /** Font align. */
    align?: "left" | "center" | "right" | "justify";
    /** Underline font style. */
    decoration?: "underline" | "line-through" | "none";
    /** Font transform. */
    transform?: "uppercase" | "lowercase" | "capitalize" | "regular";
    /** Font overflow. */
    overflow?: "truncate" | "ellipsis" | "visible";
    /** Font whitespace. */
    whitespace?: "regular" | "no-wrap" | "pre" | "pre-wrap" | "pre-line" | "break-spaces";
    /** Font word break. */
    wordBreak?: "regular" | "smart" | "all";
    /** Custom className for styling. */
    className?: string;
    /** Element variant. */
    variant?: Variant;
    /** Font weight. */
    weight?: "light" | "regular" | "medium" | "bold";
    /** Font size. */
    size?: "32" | "18" | "16" | "14" | "12" | "10";
}
export type TypographyProps<C extends React.ElementType> = PolymorphicComponentPropsWithRef<C, ITypographyProps>;
export type TypographyComponent = <C extends React.ElementType = "div">(props: TypographyProps<C>) => React.ReactElement | ReactNode | null;
export declare const Typography: TypographyComponent & {
    displayName?: string;
};
//# sourceMappingURL=Typography.d.ts.map