UNPKG

@postenbring/hedwig-react

Version:

React components for [Hedwig Design System](https://github.com/bring/hedwig-design-system).

58 lines 2 kB
import React from "react"; type HeadingProps = { variant: "h1-display" | "h1" | "h2" | "h3" | "h3-title"; asChild: true; as?: never; } | { variant: "h1-display" | "h1" | "h2" | "h3" | "h3-title"; as: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "div" | "label" | "p"; asChild?: never; }; interface ParagraphProps { variant?: "body" | "body-title" | "body-small" | "body-small-title" | "technical" | "technical-title" | "caption" | "caption-title"; } export type TextProps = { children: React.ReactNode; /** * The font-size of the component. By default it's `fluid` which means it's smaller on mobile and larger on desktop. * * But you can lock it to either the min or the max size. * * @default "fluid" */ size?: "min" | "max" | "fluid"; /** * Change the default rendered element for the one passed as a child, merging their props and behavior. * * @default false */ asChild?: boolean; /** * Convienence prop to change the rendered element. * * Use {@link TextProps.asChild} if you need more control of the rendered element. */ as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "div" | "label" | "p"; /** * 🚧 Experimental spacing */ _unstableSpacing?: boolean; } & (HeadingProps | ParagraphProps) & React.HTMLAttributes<HTMLParagraphElement | HTMLHeadingElement>; /** * Text component * * If the variant is `h1-display`, `h1`, `h2`, `h3`, or `h3-title` the `as` or `asChild` prop is required. * * This is to force the consumer to consider which semantic html element to use. E.g. `<h1>` or `<h2>` * * @example * ```tsx * <Text variant="h1-display" as="h1">Hello world</Text> * <Text variant="body"> * This is a body text * </Text> * ``` */ export declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLParagraphElement | HTMLHeadingElement>>; export {}; //# sourceMappingURL=text.d.ts.map